webScoket

 webScoket是什么？

---

• 支持端对端通讯
• 可以由客户端发起，也可以有服务端发起
• 用于消息通知、直播间讨论区、聊天室、协同编辑等

做一个简单的webScoket

---

客户端配置： 

1、新建一个页面叫web-scoket.html

    
    
    


    
webScoket
    发送消息
    

2、进行连接服务器端的基本操作

    
    
    


    
webScoket
    发送消息
    

服务器端配置： 

1、进入一个目录执行npm init -y

注意：执行以上命令，会生成一个package.json的文件

{
  "name": "web-scoket-sever",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

2、安装ws和nodemon插件、以下是安装插件的命令 

sudo cnpm i ws
sudo cnpm i nodemon

3、在文件夹下新建一个src目录，在src目录下新建index.js文件 

const { WebSocketServer } = require('ws')

//new 一个webScoket服务，端口号为3000
const wsServer = new WebSocketServer({ port: 3000 })

//监听连接connection，
wsServer.on('connection', wx => {
    console.info('connection');

    //监听信息，msg客户端传递过来的信息
    wx.on('message', msg => {
        console.info('收到信息', msg.toString());

        //收到信息2秒后，给客户端一个反馈
        setTimeout(() => {

            //ws.send给客户端发送信息
            wx.send('服务端已收到信息！' + msg.toString())
        }, 2000)
    })
})

4、修改package.json文件中的代码

 "dev": "nodemon src/index.js"

5、代码执行npm run dev启动服务

功能测试：

1、客户端

 2、服务器端

 总结：

1、webSocket连接过程

• 先发起一个HTTP请求
• 成功之后再升级到WebSocket协议，再通讯

2、HTTP协议和webSocket协议的区别？

 webSocket协议是ws://开头的，可双端发起请求；

webSocket没有跨域的限制

webSocket通过send和message通讯，http通过req和res通讯