[关闭]
@bornkiller 2014-07-21T12:20:59.000000Z 字数 2105 阅读 4769

socket.io学习笔记二

socket.io nodejs

浏览器端socket.io文件加载

  1. <script src="/socket.io/socket.io.js"></script>

官方示例,令人迷惑。查阅得知,socket.io 库会拦截/socket.io开始的所有路径,当做普通http请求进行响应,返回文件需要经过服务器端处理,我用浏览器保存了一份http://snowykiss.qiniudn.com/socket.io.js,方便查阅。

命名空间

假设服务器地址为http://127.0.0.1

  1. var io = require('socket.io').listen(1338);
  2. io.sockets.on('connection', function (socket) {
  3. socket.on('test', function (data) {
  4. socket.broadcast.emit('love',{'title' : 'I LOVE you forever...'
  5. ,'reason' : 'unbelieve'
  6. });
  7. });
  8. });
  1. var socket = io.connect('http://127.0.0.1:1338')
  2. socket.on('love',function(data){
  3. console.log(data);
  4. })

这里的broadcast会向其它所有连接到此端口的client side发送消息.

  1. var io = require('socket.io').listen(1338);
  2. io.of('/some').on('connection', function (socket) {
  3. socket.on('test', function (data) {
  4. socket.broadcast.emit('love',{'title' : 'I LOVE you forever...'
  5. ,'reason' : 'unbelieve'
  6. });
  7. });
  8. });
  1. var socket = io.connect('http://127.0.0.1:1338/some')
  2. socket.on('love',function(data){
  3. console.log(data);
  4. })

这里的broadcast只会向url参数为http://127.0.0.1:1338/some发送消息,虽然所有的连接都是websocket--http://127.0.0.1:1338/的连接。

Worker模式

不知道websocket对浏览器的压力是否过大,如果担心websocket进程压力,可以启用worker模式,不过需要将socket.io事件封装方式,通过worker.postMessage()配合Worker message Event重新封装一遍,感觉挺鸡肋。

  1. importScripts('socket.io.js');
  2. var socket = io.connect('http://127.0.0.1:1338/');
  3. var self = this;
  4. socket.on('butterfly',function(data){
  5. self.postMessage({"name" : "butterfly","data" : data});
  6. });
  7. socket.on('love',function(data){
  8. self.postMessage({"name" : "love","data" : data});
  9. })

下面是我用Worker微扩展测试,声明新的Worker对象后,就可以监听自定义伪事件,跟socket.io保持同步的on方法,其它伪事件监听应该相似,不做衍生说明

  1. Worker.prototype.reg = {};
  2. Worker.prototype.on = function (event,fn) {
  3. if (!this.reg[event]) {
  4. this.reg[event] = fn;
  5. } else if (typeof(this.reg[event]) == 'array') {
  6. this.reg[event].push(fn);
  7. } else {
  8. this.reg[event] = [this.reg[event], fn];
  9. }
  10. };
  11. var story = new Worker('lover.js');
  12. story.on('love',function(e){
  13. console.log(e.data);
  14. })
  15. story.addEventListener('message', function (e) {
  16. if(e.data.name){
  17. this.reg[e.data.name].call(this, e.data);
  18. }
  19. });
添加新批注
在作者公开此批注前,只有你和作者可见。
回复批注