NowJS简单介绍和实例
by yedingding
at 2011-03-19 23:02:45
original http://heikezhi.com/2011/03/19/nowjs-intro-and-example/
NowJS是Node.JS的一个RPC模块, 旨在简化实时Web应用开发.
安装
首先, 你需要安装node.js和npm. 下面以Mac系统下homebrew为例
- $ brew install node
- $ curl http://npmjs.org/install.sh
- $ export NODE_PATH=/usr/local/lib/node
- $ npm install now
服务端设置
var yourHttpServer = require('http').createServer(function(req, response){ /* Serve your static files */ }); yourHttpServer.listen(8080);
之后, 我们加载NowJS进来
var everyone = require("now").initialize(app);
客户端设置
我们需要在客户端加载NowJS库, 也很简单.
<script src="/nowjs/now.js"></script>
如何使用NowJS
NowJS的魔力在于两个对象: now, everyone.now. 刚才在服务端我们创建了everyone对象, 而在客户端通过加载now.js后now对象会被自动加入文档的全局命名空间。
每个客户端都有一个和服务端共享的now对象, 当客户端对now对象做修改后, 就会被自动同步到服务端. 而服务端的everyone.now是服务端和所有客户端共享的命名空间, 当服务端修改everyone对象后, 每个客户端的now对象都会同步修改。
基于这两个对象, NowJS可以很简单的实现RPC. 服务端可以调用客户端的函数, 客户端也直接调用服务端的函数。
还有三个回调函数值得一提。
当客户端开始建立连接时, 服务端会触发
everyone.connected(function(){});
当客户端开始断开连接时, 服务端会触发
everyone.disconnected(function(){});
当客户端建立好连接后, 客户端会触发
now.ready(function(){});
下面让我们来看一个真实的应用实例: 聊天室. 这里在服务端使用了expressjs和jade
- $ npm install express
- $ npm install jade
- chatapp - server.js - views - index.jade
server.js
var app = require('express').createServer(); app.set('view options', { layout: false }); app.get('/', function(req, res) { res.render('helloworld.jade'); }); app.listen(8080);
var everyone = require("now").initialize(app); everyone.connected(function() { console.log("Joined: " + this.now.name); }); everyone.disconnected(function() { console.log("Left: " + this.now.name); }); everyone.now.distributeMessage = function(message) { everyone.now.receiveMessage(this.now.name, message); };
index.jade
!!! 5 html(lang="en") head title nowjs test script(type="text/javascript", src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js") script(src="http://localhost:8080/nowjs/now.js") script(type="text/javascript") $(document).ready(function() { now.name = prompt("What's your name?", ""); now.receiveMessage = function(name, message) { $("#messages").append("<br>" + name + ": " + message); } $("#send-button").click(function() { now.distributeMessage($("#text-input").val()); $("#text-input").val(""); }); }); body #messages input(type="text", id="text-input") input(type="button", value="Send", id="send-button")
$ node server.js
然后在浏览器里访问http://localhost:8080. 一个聊天室应用完工了. 试试看吧, :)
无觅猜您也喜欢: | |||
将数学变成音乐: 那么Pi听起来会如何呢? |
iRobot的机器人也要投入救援战斗了 |
蛋疼之字母人像 |
为什么Quick Bar还是如此讨人厌 |
无觅 |