biyeah 发表于 2013-1-29 08:55:48

nowjs和nodejs实现服务器端与客户端实时数据传输的例子

参考:http://www.bennadel.com/blog/2171-Realtime-Messaging-And-Synchronization-With-NowJS-And-Node-js.htm

    先说例子实现的功能。网页上有一图片,图片可以拖动。用浏览器打开多个同一网页,当图片移动时,其它页面的图片会同步移动。例子也展示了用jQuery实现图片的拖动。
测试环境window7,nodejs v0.6.5 分别用ie,firefox,chrome打开http://127.0.0.1:8080/client.html,所有该网页上的图片会同步移动。贴上代码。
server.js端:
需要用sock.io和nowjs第三包,推荐用npm方式安装。nowjs包在window的安装可参考:
http://blog.nowjs.com/running-nowjs-natively-on-windows
// Include the necessary modules.var sys = require("util");var http = require("http");var url = require("url");var path = require("path");var fileSystem = require("fs");// ---------------------------------------------------------- //// ---------------------------------------------------------- //// Create an instance of the HTTP server.var server = http.createServer(    function (request, response) {// Get the requested "script_name". This is the part of the// path after the server_name.      var scriptName = request.url;// Convert the script name (expand-path) to a physical file// on the local file system.      var requestdFilePath = path.join(process.cwd(), scriptName);// Read in the requested file. Remember, since all File I/O// (input and output) is asynchronous in Node.js, we need to// ask for the file to be read and then provide a callback// for when that file data is available.//// NOTE: You can check to see if the file exists *before* you// try to read it; but for our demo purposes, I don't see an// immediate benefit since the readFile() method provides an// error object.      fileSystem.readFile(            requestdFilePath,            "binary",            function (error, fileBinary) {// Check to see if there was a problem reading the// file. If so, we'll **assume** it is a 404 error.                if (error) {// Send the file not found header.                  response.writeHead(404);// Close the response.                  response.end();// Return out of this guard statement.                  return;                }// If we made it this far then the file was read in// without a problem. Set a 200 status response.                response.writeHead(200);// Serve up the file binary data. When doing this, we// have to set the encoding as binary (it defaults to// UTF-8).                response.write(fileBinary, "binary");// End the response.                response.end();            }      );    });// Point the server to listen to the given port for incoming// requests.server.listen(8080);// ---------------------------------------------------------- //// ---------------------------------------------------------- //// Create a local memory space for further now-configuration.(function () {// Now that we have our HTTP server initialized, let's configure// our NowJS connector.    var nowjs = require("now");// After we have set up our HTTP server to serve up "Static"// files, we pass it off to the NowJS connector to have it// augment the server object. This will prepare it to serve up// the NowJS client module (including the appropriate port// number and server name) and basically wire everything together// for us.//// Everyone contains an object called "now" (ie. everyone.now) -// this allows variables and functions to be shared between the// server and the client.    var everyone = nowjs.initialize(server);// Create primary key to keep track of all the clients that// connect. Each one will be assigned a unique ID.    var primaryKey = 0;// When a client has connected, assign it a UUID. In the// context of this callback, "this" refers to the specific client// that is communicating with the server.//// NOTE: This "uuid" value is NOT synced to the client; however,// when the client connects to the server, this UUID will be// available in the calling context.    everyone.connected(      function () {            this.now.uuid = ++primaryKey;      }    );// Add a broadcast function to *every* client that they can call// when they want to sync the position of the draggable target.// In the context of this callback, "this" refers to the// specific client that is communicating with the server.    everyone.now.syncPosition = function (position) {//syncPosition()在这里定义,在客户端调用// Now that we have the new position, we want to broadcast// this back to every client except the one that sent it in// the first place! As such, we want to perform a server-side// filtering of the clients. To do this, we will use a filter// method which filters on the UUID we assigned at connection// time.      everyone.now.filterUpdateBroadcast(this.now.uuid, position);    };// We want the "update" messages to go to every client except// the one that announced it (as it is taking care of that on// its own site). As such, we need a way to filter our update// broadcasts. By defining this filter method on the server, it// allows us to cut down on some server-client communication.    everyone.now.filterUpdateBroadcast = function (masterUUID, position) {// Make sure this client is NOT the same client as the one// that sent the original position broadcast.      if (this.now.uuid == masterUUID) {// Return out of guard statement - we don't want to// send an update message back to the sender.            return;      }// If we've made it this far, then this client is a slave// client, not a master client.      this.now.updatePosition(position);//updatePosition()为客户端定义的方法,在这里可调用,用this修饰now。    };})();// ---------------------------------------------------------- //// ---------------------------------------------------------- //// Write debugging information to the console to indicate that// the server has been configured and is up and running.sys.puts("Server is running on 8080");

我把重要的东西摘录下来:
<div class="quote_title">引用
页: [1]
查看完整版本: nowjs和nodejs实现服务器端与客户端实时数据传输的例子