sockete.ioでWebsocketを実現する簡単な例

3124 ワード

JavaScript websocket

sockete.ioでWebsocketを実現する簡単な例
クライアントコード:

<html>
<head>
    <title></title>
    <script src="../js/socket.io.client.js"></script>
    <script type="text/javascript">
        function doit() {
            var socket = io.connect('http://localhost');
            socket.on('news', function (data) {//             'new'   
                console.log(data.hello);//data            。
                socket.emit('my new event', { my:'new data' });//        ，        
            });
            socket.on('other', function (data) {//       'other'  ，
                console.log(data.hello);
                socket.emit('event1', { my:'other data' });
            });
        }
    </script>
</head>
<body>
<button id='btn' onclick="doit()">click me</button>
</body>
</html>

chromeでは、Crtl+Shift+jが端末を開け、出力結果を見ることができます.
sockett.io.client.jsはいいです.
https://github.com/LearnBoost/socket.io-clientは当地にダウンロードして、サーバーはnodejsで実現します.
コード

var http= require('http'), io= require('socket.io'), express= require('express');
var app = express.createServer(), io = io.listen(app);

app.listen(80);

io.sockets.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });//监听，一旦客户端连接上，即发送数据，第一个参数'new'为数据名，第二个参数既为数据
  socket.on('my other event', function (data) {//捕获客户端发送名为'my other event'的数据
    console.log(data.my);
  });

  socket.emit('other', { hello: 'other world' });//发送另一个数据
  socket.on('evnet1', function (data) {//捕获另外一个数据
    console.log(data.my);
  });
});

テストの結果、クライアントは正常に表示することができます.
参照
ワールド
otherワールド
サーバ側に結果が表示されます.
参照
C:\java\Nodejs>node server.2 js
   info - sockete.io started
   debug-client authorized
   info - handshake authorized 1551970602200878177
   debug-setting request GET/sockett.io/1/websocket/1551970621 00878177
   debug-set heart beat interval for client 1551970621 00878177
   debug-client authorized for
   debug-websocket writing 1:
   debug-websocket writing 5::::「"name":"news","args":「{hello]:"world"」}」
   debug-websocket writing 5::::「"name":"other","args":「{hello]」:「other world」｝
］
   debug-emiting heart beat for client 1551970621 00878177
   debug-websocket writing 2:
   debug-set heart beat timeout for client 1551970621 00878177
   debug-got heart beat packet
   debug-cleared heart beat timeout for client 1551970621 00878177
   debug-set heart beat interval for client 1551970621 00878177
^C

js時間比較(yyyymmdd)