WebSocket 對web應(yīng)用來將是一個事件驅(qū)動，全雙工異步通信通道(WebSocket is an event-driven, full-duplex asynchronous communications channel for your web applications)
websocket特點：
- 在TLS(Transport Layer Security 或 SSL)協(xié)議上進行操作
- 能夠?qū)崟r的更新，減少客戶端和服務(wù)端(更多)資源需求
- 使用HTTP作為初始化傳輸機制，客戶端接受到響應(yīng)之后，通信不會中斷，因此能夠拜托傳統(tǒng)的HTTP request/response 模式的約束
- 只要連接(connection)保持打開，客戶端和服務(wù)端就能夠自由異步的發(fā)送信息，而不用使用輪詢(polling)
學(xué)習(xí)目標(biāo)：
- 了解Websocket API
- Websocket 協(xié)議： 信息傳遞工具
- web 應(yīng)用中如何使用
API
初始化
WebSocket 的構(gòu)造器有2個參數(shù)：
-
URL： 用作連接到服務(wù)器，如果不指定端口，則會通過默認(rèn)端口80(HTTP 端口)或者端口443(HTTPS 端口)連接 -
protocol(可選參數(shù)): 可以是數(shù)組或者一個字符串，不傳入則默認(rèn)為空字符串，用來指定子協(xié)議(subprotocols)。頭文件作為 Sec-WebSocket-Protocol,一個server能夠?qū)崿F(xiàn)多個WebSocket子協(xié)議
WebSocket的一些協(xié)議：
- Registered protocols: 在WebSocket RFC6455的規(guī)范中，第11.5節(jié)定義了子協(xié)議名稱由IANA維護注冊的注冊管理機構(gòu)。
- Opened protocols: 可以使用開發(fā)的未注冊的協(xié)議，比如XMPP(Extensible Messaging and Presence Protocol) 或者 STOMP(Simple Text Oriented Message Protocol 面向簡單文字信息協(xié)議)
- Custom protocols: 可以自由設(shè)計協(xié)議，只要客戶端和服務(wù)端都支持，推薦使用包含子協(xié)議發(fā)起方(originator)的域名的ASCII版本的名稱，比如：chat.acme.com
使用本地server,而不使用web server代理連接的話，可以通過下列方式來實例化一個WebSocket對象
# 此處URL為: 'ws://localhost:8181'
# 如果使用TLS傳輸協(xié)議，URL中的'ws://' 可以用 'wss://'替換
var ws = new WebSocket('ws://localhost:8181');
事件
open
當(dāng)WebSocket server響應(yīng)連接請求，握手完成，open 事件觸發(fā)，連接建立。
此時服務(wù)端完成握手，準(zhǔn)備好發(fā)送信息和接收來自客戶端應(yīng)用的信息
var stock_request = {"stock": ["AAPL", "MSFT", "AMZN", "GOOG", "YHOO"]}
// WebSocket 連接建立
ws.onopen = function(e) {
console.log('Connection established');
ws.send(JSON.stringify(stock_request));
};
// stock_request json化后的字符串通過WebSocket發(fā)送給服務(wù)端
// 服務(wù)端知道哪些stocks需要更新
// 并且每隔1s向客戶端將信息發(fā)送這些stocks信息
可以通過這個事件，可以向服務(wù)器發(fā)送信息，并且輸出狀態(tài)到屏幕，連接已準(zhǔn)備好，可以開始雙向的通信
message
當(dāng)服務(wù)器端有數(shù)據(jù)，WebSocket API將調(diào)用 'message' 事件
error
當(dāng)發(fā)生錯誤時，'error'事件觸發(fā)，然后 'close' 事件將觸發(fā)或者嘗試重新連接，code 和 reason 特性能夠提供一些錯誤信息
ws.onerror = function(e) {
console.log('WebSocket failure, error', e);
handleErrors(e);
}
PING/PONG
WebSocket協(xié)議調(diào)用2種幀類型： PING 和 PONG。
客戶端不能夠發(fā)送PING到服務(wù)端，PING只能由服務(wù)端發(fā)送，瀏覽器應(yīng)當(dāng)以PONG作為回應(yīng)
close
當(dāng)WebSocket連接關(guān)閉，'close'事件將觸發(fā)，同時'onerror' 將被執(zhí)行。一旦此事件觸發(fā)，服務(wù)器和客戶端的連接也就斷開了
code 和 reason 特性，可以用于指示要處理的錯誤條件或close事件的原因,
wasClean(布爾值)可以用來判斷中斷是否完整， readyState 的值，從2('closing') 變?yōu)?3('closed')
// close事件
ws.onclose = function(e) {
console.log(e.reason + ' ' + e.code);
for (var symbol in stocks) {
if (stocks.hasOwnProperty(symbol)) {
stocks[symbol] = 0;
}
}
}
// close方法
ws.close(1000, 'WebSocket connection closed');
方法
WebSocket的創(chuàng)建者使它的方法十分的簡單，只有2個方法：
- send()
- close()
send()
當(dāng)客戶端和服務(wù)端建立起連接，客戶端可以指定什么類型的數(shù)據(jù)能夠被傳遞，能夠接收 string 和 binary 的值。
我們知道WebSocket是事件驅(qū)動的，使用此事件前，必須保證連接已經(jīng)打開，并且準(zhǔn)備好了接收消息，可以通過下面2種方式來完成：
1.在 onopen 事件中發(fā)送數(shù)據(jù)
var ws = new WebSocket('ws://localhost:8181');
ws.onopen = function(e) {
ws.send(JSON.stringify(stock_request));
}
2.檢查 readyState 特性，確保WebSocket對象準(zhǔn)備好了接收messages
function processEvent(e) {
if (ws.readyState === WebSocket.OPEN) {
// Socket 打開，Send
ws.send(e);
} else {
// 顯示錯誤信息，待會再發(fā)送
}
}
close()
斷開WebSocket連接或者中斷嘗試連接完成可以使用 close方法，調(diào)用此方法之后，數(shù)據(jù)就不能夠再傳遞了
可以不帶參數(shù)使用：
ws.close()
或者傳入一個 數(shù)字代碼 和 關(guān)閉原因
ws.close(1000, 'Goodbye, World');
數(shù)字代碼：
-
1000：
CLOSE_NORMAL,正常關(guān)閉，連接任務(wù)已經(jīng)成功完成 -
1001：
CLOSE_GOING_AWAY,終端離開，要么服務(wù)器失敗或者瀏覽器離開連接的頁面 -
1002：
CLOSE_PROTOCOL_ERROR, 由于協(xié)議錯誤，終端終止連接 -
1003：
CLOSE_UNSUPPORTED,由于終端接收到的數(shù)據(jù)類型不支持，連接斷開 -
1004：
CLOSE_TOO_LARGE,接收到的數(shù)據(jù)過大導(dǎo)致連接斷開 -
1005：
CLOSE_NO_STATUS,保留數(shù)字代碼，顯示沒有狀態(tài)碼被提供 -
1006：
CLOSE_ABNORMAL,表示連接意外被終止
特性(Attributes)
當(dāng)連接建立(open),客戶端應(yīng)用中有幾個可使用的特性
readyState
只讀，在客戶端發(fā)送數(shù)據(jù)之前最好先檢查一下這個屬性，這個屬性有4個值，分別表示W(wǎng)ebSocket不同的狀態(tài):
-
WebSocket.CONNECTING:0, 連接還沒有打開 -
WebSocket.OPEN:1,連接打開，準(zhǔn)備好通信 -
WebSocket.CLOSING:2,連接正在關(guān)閉中 -
WebSocket.CLOSED:3,連接關(guān)閉
不同的值可以用于調(diào)試和了解連接服務(wù)器的生命周期
bufferedAmount
發(fā)送到服務(wù)器的緩存數(shù)據(jù)量，多用于發(fā)送 binary 數(shù)據(jù)，因為該數(shù)據(jù)量給瀏覽器處理過大，這個屬性最大的用處就是 在關(guān)閉連接之前確保所有的數(shù)據(jù)都被發(fā)送，并且實現(xiàn)客戶端節(jié)流(throttling)
protocol
WebSocket構(gòu)造器可選參數(shù)，客戶端發(fā)送多個子協(xié)議到服務(wù)器，服務(wù)器決定選取那個協(xié)議，客戶端和服務(wù)端握手完成，服務(wù)端應(yīng)當(dāng)包含選擇的協(xié)議或者什么也沒有
總結(jié)
本章主要了解了WebSocket的一些基本概念，以及WebSocket建立客戶端與服務(wù)端的優(yōu)勢，主要有：
- WebSocket的定義
- WebSocket對象的實例化，2個參數(shù)，URL，protocols(可選)
- WebSocket相關(guān)的一些事件：open, message, error, close, PING/PONG
- 2個方法：send(), close()
- 特性：readyState，bufferedAmount, protocol
