如何使用ajax 实现实时进度条

Question

如何使用ajax 实现实时进度条

Answer 1

• 用户AJAX提交操作，服务端生成一个任务ID，输出

• 服务端计算当前任务一共分几步

• ajax 轮询一个JSON接口获取当前执行到了第几步

• 算百分比

• 完毕

Answer 2

看了看楼上几位说的基本都是XMLHttpRequest这个对象的那个onprogress事件里面获取进度。

这个进度只是表示上传进度！！！

其实，我之前还遇到过需要知道一个相对较长的后端任务的进度的问题。
如果任务特别长，http连接可能断掉，那么就需要创建任务ID，使用ajax轮训进度。

如果任务没有那么长，但是服务器又不能立即返回，那么可以简单的更改一下响应超时时间，然后服务端使用chunked，一点点的把进度返回回来。浏览器会收多少，解析多少的。

Answer 3

干嘛不做一个假的呢？反正服务器端处理完成之后你前端显示100%

Answer 4

原生的XMLHttpRequest目前已经有许多浏览器支持Progress Events了，可以参考

如果还要支持想是IE之类的浏览器，最好看看兼不兼容

Answer 5

如果你需要真实的，就ajax轮询服务器。 如果只是装个样子，就固定一个时间好了，等服务器加载完成然后100%就可以了

Answer 6

貌似只有上传文件时, 才可以获取到进度, 直接post或者get文本数据, 是不行的...