3

我的应用程序涉及繁重的客户端图像处理。由于文件在用户会话期间被频繁修改,我们不会将它们物理上载到服务器,直到用户完成并选择保存图像。

使用 html5 文件 API 从客户端读取图像并以 base64 字符串的形式存储在内存中,用户可以在其中快速有效地执行他/她的操作。

当用户选择保存时,我们通过标准的 ajax POST 将一个或多个字符串传输到服务器,然后将图像构建到服务器端的物理文件中。

我想做的是为这个最后的上传阶段提供一个进度条。

现在,我很清楚 html5 规范包括对文件上传进度报告的支持。但是,我们没有使用标准的上传方法,而是如上所述,图像是作为字符串发送的。

所以我的问题真的归结为以下几点:

A)无论如何实际测量在简单帖子(PHP服务器端)期间发送的实际字节。如果是这样,这将起作用,因为我已经从 HTML5 filereader api 获得了以字节为单位的图像大小。

B)如果没有的话,我可以将 base64 数据即时转换为实际文件,并通过标准 html5 上传方法发送它们,同时报告进度。

在任何一种情况下......如果是这样,怎么办?

提前谢谢了。

4

2 回答 2

2

通过 ajax 发送 Base64 图像会更容易。Ajax 使用回调函数,因此只需使用某种指示符让用户知道ajax 已启动(即文件下载已开始)。完成后,回调函数将运行,现在您可以关闭指示器,无论它是什么。

至于通过ajax测量实际字节,我不确定。

这种方法

使用 ajax 请求显示进度条进度

建议估计一下。我会更进一步,也许时间回调超过 10 次尝试(使用这个平均值来估计你的进度条并使用上面提到的 90% 技巧)。

或者,如果您想对 Base64 文本进行编码/解码。

如何在 JavaScript 中将字符串编码为 Base64?

于 2012-12-17T19:18:36.550 回答
1

根据您使用的服务器技术,有多种选择。

  1. 使用CometJavascript 长轮询从服务器获取上传进度,并从客户端更新进度条

  2. 如果您在后端使用 .Net 技术,请探索SignalR库,它将提供所有管道以提供服务器和客户端之间的实时通信。

于 2012-12-17T19:19:18.227 回答