websoket

websoket是html5新特性,
它提供一种基于TCP连接上进行全双工通讯的协议;
全双工通信的意思就是:允许客户端给服务器主动发送信息,也支持服务端给另一个客户端发送信息.
Websoket使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在webSoket API中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。

网站为了实现推送技术,2种方案;
1.请求轮询
2.Websoket
websoket_第1张图片

<script>
    // WebSocket使用的是加密的ws协议,通常是wss协议
    var ws = new WebSocket('url'); //向后端发送请求建立连接
    ws.onopen = () => {
        //成功连接建立的时候触发onopen的回调;
        console.log('websocket连接成功');
    }
    ws.onmessage = (data) => {
        //客户端接收到服务端数据时触发
        console.log('websocket客户端接收到服务端数据时触发');
        console.log('data', data); //data就是服务器返回给我们前端的消息
    }
    ws.onerror = () => {
        //通讯发生错误时触发;
        console.log('websocket通讯发生错误时触发');
    }
    ws.onclose = () => {
        //服务端那边主动关闭连接时触发
        console.log('websocket_服务端那边主动关闭连接');
    }
    //当你发送消息的时候,就用ws.send()方法
    ws.send('往服务器发送消息') //使用连接发送数据
    // 当你想退出聊天室或者长连接的时候,就可以用ws.close()
    ws.close() //前端主动关闭连接
</script>

你可能感兴趣的:(前端,react.js,javascript)