首页 > web页面中如何实现操作进度条?

web页面中如何实现操作进度条?

像软件安装那种进度条
jQuery有这类插件,但如何对应程序的执行进度?


相关技术就是所谓的 ”Comet“ 或者 ”Server Push“,实现方式有 ”Streaming“ 和 ”Long Pulling“,HTML5 下有 ”WebSocket / Server-Sent Eents”。

“Long Pulling” 方式下,服务端可以提供一个 URL,然后浏览器通过 JS 访问该地址,保持连接开启直到有新的数据发送或者超时结束,然后浏览器再次发出一个请求。这里面会同时受到浏览器和服务器的限制,所以需要进行一定的适配。如果是 “XHR Streaming” 方式,则一般是服务器保持连接不断然后不停 flush 数据,浏览器依靠 readystate 的值来判断是否有新的数据,这在 IE 下有兼容性问题。Gmail 采用过一个叫做 “Hidden frame/iframe Streaming” 的技术,通过 iframe 接受 <script> 脚本,好处是可以跨域。

网上有很多相关资料,具体 Google 吧,下面列出一些我收集整理的资料。

  1. http://infrequently.org/2006/03/comet...
  2. http://infrequently.org/2006/02/what-...
  3. http://ajaxpatterns.org/HTTP_Streamin...
  4. http://www.subbu.org/blog/2006/04/dis...
  5. http://www.screenr.com/SNH
  6. http://www.webreference.com/programmi...
  7. http://www.webreference.com/programmi...
  8. http://www.zeitoun.net/articles/comet...
  9. http://wiki.secondlife.com/wiki/Rever...
  10. http://en.wikipedia.org/wiki/WebSocke...
  11. http://www.slideshare.net/PeterREgli/...
  12. http://www.josephj.com/entry.php?id=3...
  13. http://www.ibm.com/developerworks/cn/...
  14. http://blog.csdn.net/linbo6/article/d...

还有很多,就不一一列举了。我没法告诉你如何具体去做,每个业务需求也不同,但原理都是一样的。

【热门文章】
【热门文章】