• WebSocket 实现长连接演示代码


    服务端代码(node)

    const WebSocket = require('ws')
    const ws = new WebSocket.Server({ port: 8080 },()=>{
        console.log('socket start')
    })
    // 创建服务器
    // 连接监听 clinet表示已经连接的客户端对象有多个
    
    let clinets=[] //保存所有客户端连接
    ws.on('connection',(clinet)=>{
      console.log('客户端已连接')
      clinets.push(clinet)
      // clinet.send('欢迎广临')// 主动向前端发送数据  只能发送字符串
    
      clinet.on('message',(msg)=>{
        // 监听客户端发送消息
        console.log('来自前端的问候:')
        console.log(msg)
      })
    
      clinet.on('close',(msg)=>{
        // 客户端主动断开连接
        console.log('客户端主动断开连接')
      })  
    })
    
    setTimeout(()=>{
      sendAll()
    },20000)
    
    //群发 广播
    function sendAll(){
      for (let index = 0; index < clinets.length; index++) {
        let  num=parseInt(Math.random()*200)%3+1
         clinets[index].send(JSON.stringify({type:num}))
        
      }
    }
    
    

    客户端(H5)

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
    </head>
    <body>
      <button onclick="sendserver()">send server</button>
      <script>
        const ws = new WebSocket('ws://localhost:8080/')
        ws.onopen=function(){
          console.log('与服务器连接')
        }
        ws.onmessage=function(msg){
          console.log(msg)
          console.log('来自服务器的问候:'+msg.data)
          let data=JSON.parse(msg.data)
          switch(data.type){
            case 1 :
              alert('恭喜中间')
              break;
          
          case 2 :
              alert('会员到期')
              break;
          
          case 3 :
              alert('收到信息请注意查收')
              break;
          
        }
      }
        ws.onclose=function(){
          console.log('服务器主动断开连接')
        }
        function sendserver() {
            ws.send('你好我来了')
        } 
    
      </script>
    </body>
    </html>
    

    ps

    1.websocket 长连接是没有跨域问题的

    2.服务器端和客户端都是多对多的

    3.websocket是H5的新特性,受浏览器限制,因此老版本的浏览器可能就不行了

  • 相关阅读:
    dynamic_cast
    struct 字节对齐详解
    CentOS修改系统的默认启动模式为命令号界面
    linux系统备份还原
    linux 缺少libxxx.a 静态链接库
    linux下SVN忽略文件/文件夹的方法
    取消svn add
    centos 中文乱码解决办法2
    安装rpm包时遇到error: Failed dependencies:错误
    Linux rpm 命令参数使用详解[介绍和应用]
  • 原文地址:https://www.cnblogs.com/zhenhunfan2/p/13626578.html
Copyright © 2020-2023  润新知