使用javascript加载/显示图像并获得%下载

时间:2012-06-25 01:12:40

标签: php javascript html

所以一些背景:我正在做的是创建一个库,动态显示服务器目录中所有图片的缩略图(它缓存缩略图,不用担心)。当用户单击缩略图时,将显示加载gif,直到图像准备就绪,然后显示图像。实际图片非常大,可能需要相当长的时间才能下载到用户计算机。

我想要做的是显示加载gif播放时下载的图片的百分比。

我意识到还有其他这样的问题,而且从目前为止我做过的研究中,我也意识到如果没有一些服务器端技巧,这可能无法实现。

从我在最后一点中看到的,我收集了(我可能是错的,所以请纠正我,如果我)是客户端代码,知道收到了多少字节,但不是文件的大小。

那么是否有可能使用一些php / javascript技巧配置,以便客户端javascript可以从Web服务器目录加载图像并能够计算下载的百分比?

可能是php代码向文件大小或其他东西发送一个额外的标题?或者甚至向Web服务器打开第二个请求文件大小?你怎么能得到当前下载的字节?

1 个答案:

答案 0 :(得分:0)

您可以使用XMLHttpRequest2加载数据并挂钩进度事件。加载的数据将转换为base64并添加到数据URI中。加载完成后,您可以为构造的URI分配新的图像源。

可以在此处找到更多信息:http://blogs.adobe.com/webplatform/2012/01/13/html5-image-progress-events/