• WebSocket


    什么是WebSocket

    WebScoket是一种让客户端和服务器之间能进行双向实时通信的技术。它是HTML最新标准HTML5的一个协议规范,本质上是个基于TCP的协议,它通过HTTP/HTTPS协议发送一条特殊的请求进行握手后创建了一个TCP连接,此后浏览器/客户端和服务器之间便可以通过此连接来进行双向实时通信。

    为什么引入WebSocket协议

    http协议是一种单向的网络协议,在建立连接后,它只允许Browser/UA(UserAgent)向WebServer发出请求资源后,WebServer才能返回相应的数据。而WebServer不能主动的推送数据给Browser/UA。

    假设我们想开发一个基于Web的应用程序去获取当前Web服务器的实时数据,例如股票的实时行情,火车票的剩余票数等等,这就需要Browser/UA与WebServer端之间反复的进行http通信,Browser不断的发送Get请求,去获取当前的实时数据。以前一般的做法是:Polling(轮询)。客户端定时频繁的向服务器发出请求,这样效率很低,而且HTTP数据包头本身的字节量较大,浪费了大量带宽和服务器资源;

    什么情况下使用WebSocket

    扫码登录、后台消息提醒等

    如何使用WebSocket

    在支持WebSocket的浏览器中,创建Socket之后,通过onopen、onmessage、onclose、onerror四个事件的实现来处理Socket的响应;

    var ws = new WebSocket("ws://echo.websocket.org");//WebSocket协议的URL使用ws://开头,另外安全的WebSocket协议使用wss://开头。
    ws.onopen = function(){ws.send("Test!"); };//连接成功后,browser会触发onopen消息 
    ws.onmessage
    = function(evt){console.log(evt.data);ws.close();};//如果连接失败,发送、接收数据失败或者处理数据出现错误,browser会触发onerror消息
    ws.onclose
    = function(evt){console.log("WebSocketClosed!");}; //当Browser接收到WebSocketServer发送过来的数据时,触发onmessage消息
    ws.onerror
    = function(evt){console.log("WebSocketError!");};//当Browser接收到WebSocketServer端发送的关闭连接请求时,触发onclose消息。

    代码实例:

     StartWebSocket() {
            var url = "ws://127.0.0.1:5000/";
            var ws = ''
            if ('WebSocket' in window) {//webSocket API的相关规范,浏览器提供了WebSocket类型,在Firefox中为MozWebSocket
              ws = new WebSocket(url);
            } else if ('MozWebSocket' in window) {
              ws = new MozWebSocket(url);
            }
            ws.onopen = function () {
              console.log("Connection open ...");
              var msg = "{"method":"getregistercode"}";
              ws.send(msg);
            };
            ws.onerror = function () {
              console.log("Connection error ...");
            }
            ws.onmessage = function (e) {
              var data = e.data;
              that.machinecode = data
            }
            ws.onclose = function () {
              console.log("连接中断");
            };
          },
  • 相关阅读:
    IO模型
    Linux获取CPU,内存和硬盘信息
    让eclipse变得快点,取消validation
    axure 使用笔记
    linux所有硬盘给了一个分区了,然后要从这个分区中拿出部分空间,创建一个新的分区。如何做到?
    maven安装与配置
    svn 使用笔记
    git 使用笔记
    北邮校内网络认证===python脚本实现
    配置javac环境
  • 原文地址:https://www.cnblogs.com/liangtao999/p/13025963.html
Copyright © 2020-2023  润新知