• node.js之socket.io模块


    socket.io模块是一个基于Node.js的项目,其作用主要是将WebSocket协议应用到所有的浏览器。该模块主要应用于实时的长连接多请求项目中,例如在线联网游戏、实时聊天、实时股票查看、二维码扫描登录等。——Node.js开发实战详解

    安装和配置的方法和一般的NPM模块安装配置一致:

    #    npm install soctet.io

    应该是因为我的本地服务器是win7操作系统,所以在安装的时候会有一堆错误提示,但是貌似不影响使用socket.io模块,没有太在意这个。不知道在linux上是不是也这样,等有时间会去我的服务器上试一下。

    这里推荐一个官方的socket.io模块的实例教程,实现了一个在线聊天的功能,对学习这个模块有不小的帮助。

    接下来介绍一下socket.io中常用的接口。

    1.io.sockets.on('connection',function(socket){}):这个接口是socketAPI中的socket.on接口,它和下面的socket.on接口有一点区别。每当有用户连接时,它都会执行一次回调函数。这里有三点需要注意,io.sockets.on中是sockets,发送的事件名为connection,还有回调函数需要传入一个参数socket。

    2.soctet.on('event',function(){}):这个的作用是接收到事件后执行回调函数。第一个参数是事件名,第二个参数是要执行的回调函数。

    3.socket.emit('event',{test:'hello world'},function(){}):这个接口是发送一个事件。第一个参数是事件名,第二个参数是发送的数据内容,第三个参数是需要执行的回调函数。

    4.socket.broadcast.emit('event',function(){}):就和他的接口名一样会像广播发给其他连接网站的用户。但是有一点比较费解,他不会发给来源,打个比方:A用户连接网站时会给服务器发送一个连接事件,服务器收到后用这个接口广播发给所有连接着的用户一个通知事件,然后用户B、用户C……都能收到这个通知事件,而用户A不会收到。

    5.socket.send('hello'):第一个参数是发送的数据,和emit类似,都是用来发送数据,但是如果用send发送,无法指定事件名,接收时会用message事件来接收,而emit可以自己定义事件名来接收数据。因此通常都是用emit,不建议使用send。

    6.socket.get/set('foo', bar, function () {}):第一个参数是数据名,第二个参数是发送的数据,第三个是回调函数,set用来进行保存数据的操作,get用来取出已保存的数据。

    最后贴上我自己测试用的代码:

    server:

    var app = require('express')();
    var http = require('http').Server(app);
    var io = require('socket.io')(http);
    
    app.get('/', function(req, res){
      res.sendFile(__dirname + '/index.html');
    });
    io.on('connection', function(socket){
      console.log('a user connected');
      socket.broadcast.emit('hi');
    
    
      socket.on('chat message', function(msg){
        io.emit('chat message', msg);
      });
    
      socket.on('disconnect', function(){
        console.log('user disconnected');
      });
    
    
    });
    
    io.emit('some event', { for: 'everyone' });
    
    
    http.listen(3000, function(){
      console.log('listening on *:3000');
    });

    client:

    <!doctype html>
    <html>
      <head>
        <title>Socket.IO chat</title>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.7/socket.io.js"></script>
        <script src="http://code.jquery.com/jquery-1.11.1.js"></script>
        <style>
          * { margin: 0; padding: 0; box-sizing: border-box; }
          body { font: 13px Helvetica, Arial; }
          form { background: #000; padding: 3px; position: fixed; bottom: 0;  100%; }
          form input { border: 0; padding: 10px;  90%; margin-right: .5%; }
          form button {  9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
          #messages { list-style-type: none; margin: 0; padding: 0; }
          #messages li { padding: 5px 10px; }
          #messages li:nth-child(odd) { background: #eee; }
        </style>
      </head>
      <body>
        <ul id="messages"></ul>
        <form action="">
          <input id="m" autocomplete="off" /><button>Send</button>
        </form>
      </body>
        <script>
          var socket = io();
          $('form').submit(function(){
            socket.emit('chat message', $('#m').val());
            $('#m').val('');
            return false;
          });
          socket.on('chat message', function(msg){
            $('#messages').append($('<li>').text(msg));
          });
          socket.on('hi', function(msg){
            console.log('hi');
          });
        </script>
    </html>
     
     
  • 相关阅读:
    swagger本地环境搭建
    上传图片报错
    接口自动化测试---环境搭建
    IDEA 运行程序提交hdfs时,报错
    hadoop2.60集群搭建
    查找排除当前最大、最小salary之后的员工的平均工资avg_salary。
    按照salary的累计和running_total,其中running_total为前两个员工的salary累计和
    CSS补充
    BFC(块级格式化上下文)
    CSS精灵技术
  • 原文地址:https://www.cnblogs.com/yxyblogs/p/5054801.html
Copyright © 2020-2023  润新知