WebSocket的服務(wù)端和客戶端可以雙向進(jìn)行通訊，并且允許跨域通訊。由HTTP/1.1的Upgrade機(jī)制支持，通過ws(非加密)或wss(加密)協(xié)議進(jìn)行通訊

WebSocket WebSocket( in DOMString url, in optional DOMString protocolsWebSocket WebSocket( in DOMString url, in optional DOMString[] protocols);

HTML5只專注于客戶端的API, 而服務(wù)器端是各個(gè)語言自己去實(shí)現(xiàn)

// 創(chuàng)建一個(gè)Socket實(shí)例var socket = new WebSocket( ws://localhost:8080 // 打開Socket socket.onopen = function(event){ // 發(fā)送一個(gè)初始化消息 socket.send( I am the client and I/ m listening!  // 監(jiān)聽消息 socket.onmessage = function(event){ console.log( Client received a message ,event); // 監(jiān)聽Socket的關(guān)閉 socket.onclose = function(event){ console.log( Client notified socket has closed ,event); // 關(guān)閉Socket....  //socket.close()};

事件
onclose onerror onmessage onopen

屬性

readyState: CONNECTING 0 OPEN 1 CLOSING 2 CLOSED 3

binaryType: String Blob ArrayBuffer

方法1:
如果客戶端不支持WebSocket, 那么可以使用幾個(gè)候選選項(xiàng) Flash Socket AJAX long-polling AJAX multipart streaming IFrame JSONP polling

方法2
使用Socket.io來抹平差異,該庫可以在瀏覽器不支持WebSocket的時(shí)候, 自動(dòng)用瀏覽器支持的消息推送方式進(jìn)行連接, 該庫還會(huì)檢測(cè)連接是否掉線，并在掉線時(shí)自動(dòng)為你重新連接。

// 創(chuàng)建Socket.IO實(shí)例，建立連接var socket= new io.Socket( localhost ,{ port: 8080,socket.connect();// 添加一個(gè)連接監(jiān)聽器socket.on( connect ,function(){ console.log( Client has connected to the server! // 添加一個(gè)連接監(jiān)聽器socket.on( message ,function(data){ console.log( Received a message from the server! ,data);// 添加一個(gè)關(guān)閉連接的監(jiān)聽器socket.on( disconnect ,function(){ console.log( The client has disconnected! // 通過Socket發(fā)送一條消息到服務(wù)器function sendMessageToServer(message){ socket.send(message);}

實(shí)時(shí)雙向通信

瀏覽器本地支持良好(兼容性可以用第三方庫很好解決)

支持自定義協(xié)議

聊天室

服務(wù)器消息推送

前后端實(shí)時(shí)系統(tǒng)

Websocket | MDN

認(rèn)識(shí)HTML5的WebSocket

【相關(guān)推薦】

1. 免費(fèi)h5在線視頻教程

2. HTML5 完整版手冊(cè)

3. VeVb.com原創(chuàng)html5視頻教程

以上就是什么是 WebSocket？深入理解html5中WebSocket的詳細(xì)內(nèi)容，其它編程語言

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。