zoukankan      html  css  js  c++  java
  • WebSocket--学习笔记

    WebSocket是一种在单个TCP连接上进行全双工通信的协议。

    一、为什么需要 WebSocket?

    我们已经有了 HTTP 协议,为什么还需要另一个协议?它能带来什么好处?

    答案很简单,因为 HTTP 协议有一个缺陷:通信只能由客户端发起。

    举例来说,我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果。

    HTTP 协议做不到服务器主动向客户端推送信息。

    这种单向请求的特点,注定了如果服务器有连续的状态变化,客户端要获知就非常麻烦。

    我们只能使用"轮询":每隔一段时候,就发出一个询问,了解服务器有没有新的信息。最典型的场景就是聊天室。

    轮询的效率低,非常浪费资源(因为必须不停连接,或者 HTTP 连接始终打开)。

    因此,工程师们一直在思考,有没有更好的方法。WebSocket 就是这样发明的。

    二、简介

    WebSocket是一种在单个TCP连接上进行全双工通信的协议。
    WebSocket通信协议于2011年被IETF定为标准RFC 6455,并由RFC7936补充规范。WebSocket API也被W3C定为标准。
     
    WebSocket使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。
    在WebSocket API中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。

    WebSocket 协议在2008年诞生,2011年成为国际标准。所有浏览器都已经支持了。

    它的最大特点:服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息,是真正的双向平等对话。

    属于服务器推送技术的一种。

    其他特点包括:

    (1)建立在 TCP 协议之上,服务器端的实现比较容易。

    (2)与 HTTP 协议有着良好的兼容性。默认端口也是80和443,并且握手阶段采用 HTTP 协议,

        因此握手时不容易屏蔽,能通过各种 HTTP 代理服务器。

    (3)数据格式比较轻量,性能开销小,通信高效。

    (4)可以发送文本,也可以发送二进制数据。

    (5)没有同源限制,客户端可以与任意服务器通信。

    (6)协议标识符是ws(如果加密,则为wss),服务器网址就是 URL。

    三、客户端的简单示例

    代码相对来说,比较简单

    <script>
            //连接服务器
            var ws = new WebSocket("ws://服务器url");
    
            //连接成功触发
            ws.onopen = function(){ alert('连接成功');  }
    
            //连接失败触发
            ws.onerror = function(){ alert('连接失败'); }
    
            //接收消息时触发
            ws.onmessage = function(MessageEvent){ //返回的数据
                console.log(MessageEvent.data); 
            }
    
            //发送数据 
            ws.send('发送的具体数据');    
           
            //连接关闭 ws.close();
            ws.onclose = function() { alert('连接关闭'); };  
      
    </script>
    
    

    本文引自:http://www.ruanyifeng.com/blog/2017/05/websocket.html

  • 相关阅读:
    webpack 3.X学习之CSS处理
    webpack 3.X学习之图片处理
    webpack 3.X学习之基本配置
    webpack 3.X学习之JS压缩与打包HTML文件
    webpack 3.X学习之初始构建
    【复习】VueJS之内部指令
    前端学习记录之Javascript-DOM
    javascript常用的Math对象的方法
    nodejs+mongoose+websocket搭建xxx聊天室
    Markdown常用语法
  • 原文地址:https://www.cnblogs.com/ggll611928/p/13092239.html
Copyright © 2011-2022 走看看