大家来讨论下，浏览器自动刷新的实现

This topic created in 5406 days ago, the information mentioned may be changed or developed.

看到马克鳗的作者制作了一个小工具，可以节约前端开发的时间。

http://video.sina.com.cn/v/b/60252064-1867526932.html

监听文件保存这点很容易想明白。判断修改时间即可。
监听样式或其他资源修改也容易想明白，分析html，判断出资源添加监听项即可。

唯独想不明白如何控制浏览器刷新。作者提到与浏览器无关，甚至可以做到电脑上保存ipad上刷新，这里就比较令人困惑了，看来与浏览器api无关。这样猜测就是在页面传送到浏览器的过程中截获做了点什么手脚。

大家怎么看呢？

浏览器

监听

刷新

11 replies • 1970-01-01 08:00:00 +08:00

Hyperion

Sep 4, 2011

apache可以搞定... 用mod_ext_filter, 在页面里插入js, 然后... -_,-

或者根本就是自己写的HTTP server?

zikkeung

Sep 4, 2011

主要是服务器

supersheep

Sep 4, 2011

嗯，想明白了。

ytzong

Sep 4, 2011

我平时用的比较多的是 Expression Web 的快照功能：
每按一下 ctrl + s，快照（可理解为 SuperPreview，有多个 IE 版本和 Firefox 可以选择，我一般选择 IE6）自动刷新一次，速度不怎么快，做从无到有的页面时使用

另外还有 XRefresh http://xrefresh.binaryage.com/ 试用了一下就放弃的原因是速度更慢

qiao

Sep 4, 2011

类似的产品有很多，例如livereload，是以websocket+浏览器插件实现的。

不过楼主这个既然是浏览器无关，那么就应该是自己写的服务器，发现文件有改动时就发送一个Refresh请求。

weicaizhi

Jan 29, 2012

@supersheep 你好，能否给我详解一下这个功能的实现，或者给个学习的资料，我也要用到这个网页定时自动刷新的功能，感谢！

supersheep

Jan 30, 2012

@weicaizhi 这个工具运行一个server，会改变输出的html，在头部加上
/con/assets/js/jquery-1.6.3.min.js 及
/con/assets/js/br.js
这两个js，做的事情就是不断发送这样的请求
/con/changes?t=1327891778020&ts=0.5639723767526448
做轮询。
这个changes会做一些后端的事情，检查注册在列的文件有没有编辑更新过，并返回json，以通知浏览器刷新。说白了就觉得很简单了……

richiefans

Jan 30, 2012

@supersheep 原来如此这样想就简单多了

mywaiting

Jan 30, 2012

LZ想得太复杂了吧.....其实这东西就是实现自动检查文件是否更新....

自己写个userscript在chrome用，自动在页面加入<META HTTP-EQUIV="REFRESH" CONTENT="time; URL=url_you_need">，用script调整time和url就OK.....

啊哈哈，感觉很山寨，但是很好用......

weicaizhi

Jan 30, 2012

@supersheep 研究一下，谢谢。

qiayue

PRO

Jan 30, 2012

@mywaiting 强烈推荐此法