zoukankan      html  css  js  c++  java
  • node.js搭建简单的websocket

    1、首先在官网http://www.nodejs.org/下载NODE.JS

    2、打开命令行CMD,进入NODEJS ode_modules的目录,输入npm install socket.io  安装socket.io模块.别急着关掉此CMD窗口,后面有用

    3、搭建服务端代码server.js

     1 var http = require('http');
     2 var io = require('socket.io');
     3 var cisserver = http.createServer(function (request, response) {
     4     response.writeHead(200, { 'Content-Type': 'text/html' });
     5     response.end('start!');
     6 
     7 }).listen(8000);
     8 
     9 var ccisSocket = io.listen(cisserver); //.set('log', 1);
    10 ccisSocket.on('connection', function (client) {
    11     client.on('message', function (data) {
    12         console.log('client message', data);
    13         client.emit('message', data);
    14         client.on('disconnect', function () { console.log('disconnect') })
    15     })
    16 })

    4、切换之前NODEJS的命令行窗口输入node server.js开启监听模式

    5、客户端代码

        

     1   <!DOCTYPE html> 
     2     <html> 
     3     <head> 
     4         <script src='http://localhost:8000/socket.io/socket.io.js'></script> 
     5     </head> 
     6     <body> 
     7         <script> 
     8             var HTML5WebSockets = {};
     9             HTML5WebSockets.socketio = {
    10                 yoursocket: null,
    11 
    12                 initialize: function () {
    13 
    14                     HTML5WebSockets.socketio.yoursocket = io.connect('http://localhost:8000');
    15 
    16                     HTML5WebSockets.socketio.yoursocket.on('connect', function () {
    17                         HTML5WebSockets.socketio.log('You are connected to Server<br />');
    18                         HTML5WebSockets.socketio.yoursocket.send("目前有值");
    19                     });
    20 
    21                     HTML5WebSockets.socketio.yoursocket.on('message', function (data) {
    22                         //alert(data);
    23                         HTML5WebSockets.socketio.log('Server Response:  ' + data + '<br />');
    24                     });
    25 
    26                     HTML5WebSockets.socketio.yoursocket.on('disconnect', function () {
    27                         HTML5WebSockets.socketio.log('You are disconnected from Server<br />');
    28                     });
    29 
    30                     document.querySelector('#sendMes').onclick = function () {
    31                         HTML5WebSockets.socketio.sendMessageToServer(document.getElementById("mes").value);
    32                         document.getElementById("mes").value = '';
    33                     };
    34 
    35                 },
    36                 sendMessageToServer: function (data) {
    37                     HTML5WebSockets.socketio.yoursocket.send(data);
    38                     HTML5WebSockets.socketio.log('Message to Server: ' + data + '<br />');
    39                 },
    40 
    41                 log: function (message) {
    42                     document.getElementById("log").innerHTML += message;
    43                 }
    44             }  
    45         </script> 
    46        
    47         <div id='log'></div> 
    48         <input type='text' id='mes' /> 
    49         <button type='button' id='sendMes'>Send</button> 
    50         <br />    
    51         <script> 
    52             HTML5WebSockets.socketio.initialize();  
    53         </script> 
    54     </body> 
    55     </html> 

    7、运行HTML文件,输入值,等待服务端返回的结果

  • 相关阅读:
    SpringCloud第五天
    SpringCloud第四天
    SpringCloud第三天
    mysql数据库主从同步I/O问题修复
    linux服务器通过rpm包安装nginx案例
    potplayer最大化不遮挡任务栏
    火狐怎么在新标签打开书签
    Binding failed for port a1e67849-aa1d-418d-a04c-8343b8dbf64f, please check neutron logs for more information
    Unable to mount root fs on unknown-block(0,0)
    安装VCSA6.7
  • 原文地址:https://www.cnblogs.com/wishbay/p/3918176.html
Copyright © 2011-2022 走看看