3

我正在开发一个高度依赖于在向用户显示之前预加载图像的 Web 应用程序。但是，根据用户的操作，有时重要的是在图像有机会完成之前终止图像的加载，以免浪费带宽。是否有可能做到这一点？如果是这样，具体如何？

4

3 回答 3

2

我认为不可能停止您已经要求预加载的图像。

无论如何，即使您在请求图像后尝试终止连接，即使客户端不接受，服务器也很可能会完成数据传输（这意味着仍然浪费带宽）。

您能做的最好的事情是使用 javascript 一次预加载一个图像。这样，如果您想停止加载图像，您可以停止预加载剩余的图像，即使当前加载的图像无法停止。

如果您使用 jQuery，您可以尝试中止 AJAX 请求。

使用 jQuery 中止 Ajax 请求

通过使用 jQuery.ajax() 函数来预加载您的图像。XMLHttpRequest 对象有一个可以调用的 abort() 方法。

但是，这并没有真正记录在案。ajax() 函数不是为加载图像而设计的。您从此函数获得的图像将是无法使用的奇怪二进制文件。（因为支持无图格式，所以会解释为文本）

但是，假设浏览器正在做它应该做的事情，图像可能会被缓存。如果它被缓存，那么它将被预先加载，您可以引用相同的 url 来使用它。

缓存很大程度上受服务器返回的任何标头的影响，即图像在缓存过期之前的有效期。

于 2012-09-01T09:49:26.430 回答
2

是的，您可以使用 HTTP 流和特殊的 AJAX 方法来完成此操作。

将服务器上的每个图像编码为 base64 字符串。注意：这会将有效负载大小增加约 33%！对于 PHP，看一下base64_encode函数

将 base64 编码的字符串拆分为许多n字节大小的块。打印每个块并每次刷新输出缓冲区。flush在 php.net的评论部分有一些很好的提示

根据您实现 AJAX 调用的方式，您可以中止强制浏览器关闭连接的 XMLHttpRequest。以下是有关持久检查方法的更多信息 http://ajaxpatterns.org/HTTP_Streaming#Streaming_Wiki_Demo

当 ajax 调用完成并下载所有数据后，您可以使用数据 url 在浏览器中简单地创建图像：data:image/png;base64,ENCODED_DATA

您可能还想看看这个http://ajaxpatterns.org/archive/HTTP_Streaming.php

于 2012-09-01T23:33:30.637 回答
-1

我在 Javascript 上找到了一个可接受的（或多或少）解决方案：取消/停止图像请求并像这样应用它：

var img = new Image();
img.src = "IMG_0111.JPG";
var timer = setTimeout(function(){
        window.stop();
        document.execCommand("Stop", false);                                            
    },50);

这实现了我正在寻找的结果，尽管我担心它也会结束所有其他 HTTP 请求。

于 2012-09-01T10:29:34.393 回答