node.js – 如何进行简单的实时页面更新?
我对node.js非常新,但实际上只有一个简单的东西,我正试图通过学习语言来实现。
我想创build一个网页,通过在特定的“股利”的代码可以被dynamic地跳转到当前正在查看该网页的用户。 (即div包含一些文本,但是然后一个图像replace它。)理想情况下,交换将由网页的pipe理员通过点击一个button手动执行,或者在服务器上发射一些代码或其他东西。 网页的常规观看者将无法做到这一点 – 他们只能看到页面上的实时更改。
真实的例子:
直播互联网广播是无效的,因此“div”包含“off-air”文本。 代码的实时热切换发生在广播播放时,网页的观众现在看到的是“div”中的html5广播播放器。
为node.js新手做这个最简单的方法是什么?
非常感谢 :)
看看Socket.IO http://socket.io/#how-to-use
当服务器决定广播更改时使用:
io.sockets.emit('update-msg', { data: 'this is the data'});
在客户端上先连接socket.io,然后等待“update-msg”事件并更新你的dom:
var socket = io.connect('http://localhost'); socket.on('update-msg', function (msg) { console.log(msg); $('#mydiv').html(msg.data) });
我创build了一个系统/方法来使用RequireJS和Node.js更新(热重载)前端代码。 我确定它与React和Backbone一起工作。 你可以在这里读到它:
https://medium.com/@the1mills/hot-reloading-with-react-requirejs-7b2aa6cb06e1
自己做这件事的基本步骤:
- gulp.js观察者监听文件系统的变化
- gulpfile中的socket.io服务器向所有浏览器客户端发送消息,其中包含更改文件的path
- 客户端删除表示该文件/模块的caching,并重新要求(使用AJAX将其从服务器文件系统中拉出)
- 前端应用程序被configuration/devise为重新评估所有对希望热重载的模块的引用,在这种情况下,只有JS视图,模板和CSS可用于热重载 – 路由器,控制器,数据存储(主干集合和模型)尚未configuration。 我怀疑所有的文件可能会被重新加载,唯一的例外是数据存储。