美文网首页前端
websocket及server环境配置

websocket及server环境配置

作者: avery1 | 来源:发表于2019-04-01 17:10 被阅读68次

    看完让你彻底搞懂Websocket原理

    WebSocket 教程

    WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。

    WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。

    在 WebSocket API 中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

    现在,很多网站为了实现推送技术,所用的技术都是 Ajax 轮询。轮询是在特定的的时间间隔(如每1秒),由浏览器对服务器发出HTTP请求,然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点,即浏览器需要不断的向服务器发出请求,然而HTTP请求可能包含较长的头部,其中真正有效的数据可能只是很小的一部分,显然这样会浪费很多的带宽等资源。

    HTML5 定义的 WebSocket 协议,能更好的节省服务器资源和带宽,并且能够更实时地进行通讯。

    浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通过 TCP 连接直接交换数据。

    当你获取 Web Socket 连接后,你可以通过 send() 方法来向服务器发送数据,并通过 onmessage 事件来接收服务器返回的数据。

    以下 API 用于创建 WebSocket 对象。

    var Socket = new WebSocket(url, [protocol] );

    pywebsocket配置

    在linux上安装psweboscket

    安装git

    sudo yum install git

    git --version

    安装pywebsocket

    git clone https://github.com/google/pywebsocket.git

    进入pywebsocket路径下

    python setup.py build

    python setup.py install

    进入mod_pywebsocket路径下启动pywebsocket

    cd mod_pywebsocket/

    ls

    python standalone.py -p 9998 -w ../example

    将虚拟机端口映射到本机(vmware workstation或者putty, 我用的putty还比较快)

    本机html代码,运行点击。

    <!DOCTYPE HTML>

    <html>

      <head>

      <meta charset="utf-8">

      <title>菜鸟教程(runoob.com)</title>

          <script type="text/javascript">

            function WebSocketTest()

            {

                if ("WebSocket" in window)

                {

                  console.log("您的浏览器支持 WebSocket!");

                  // 打开一个 web socket

                  var ws = new WebSocket("ws://localhost:9998/echo");

                  ws.onopen = function()

                  {

                      // Web Socket 已连接上,使用 send() 方法发送数据

                      ws.send("发送数据");

                      console.log("数据发送中...");

                  };

                  ws.onmessage = function (evt)

                  {

                      var received_msg = evt.data;

                      console.log("数据已接收...");

                  };

                  ws.onclose = function()

                  {

                      // 关闭 websocket

                      console.log("连接已关闭...");

                  };

                }

                else

                {

                  // 浏览器不支持 WebSocket

                  console.log("您的浏览器不支持 WebSocket!");

                }

            }

          </script>

      </head>

      <body>

          <div id="sse">

            <a href="javascript:WebSocketTest()">运行 WebSocket</a>

          </div>

      </body>

    </html>

    结果,说明pywebsocket已经启动起来了。

    关掉linux端pywebsocket服务

    相关文章

      网友评论

        本文标题:websocket及server环境配置

        本文链接:https://www.haomeiwen.com/subject/ivavbqtx.html