websocket
HTML5 中新增的webSocket可以用于和后臺交互,替代ajax,可以有效的把客戶端的請求推送到服務端.WebSocket已經受到Firefox 4、Chrome 4、Opera 10.70以及Safari 5等瀏覽器的支持。且有一個優秀的第三方API，名為Socket.IO。
和ajax的不同
ajax 用于從客戶端發送請求到服務端,不能從服務端發送消息到客戶端。能實現網頁的異步刷新，不阻塞用戶,核心是XMLHTTPRequest,兼容性很好,是一種創建交互式網頁應用的開發技術.有跨域的限制
webSocket是HTML5的一種新的協議,實現瀏覽器和服務器的雙全工通信,本質是先通過HTTP|HTTPS協議進行握手后創建一個用于交換數據的TCP鏈接,服務端和客戶端通過此TCP連接進行實時通信.優點,在建立鏈接后,瀏覽器和服務器可以相互傳遞數據,用于數據實時更新.沒有跨域的限制
用法
在支持WebSocket的瀏覽器中,在創建Socket后,可以通過onopen,onmessage,onclose,onerror四個事件實現對socket的響應
代碼
//創建一個Socket實例
var socket = new WebSocket('ws://localhost:8080');
//打開Socket
socket.onOpen = function(event){
socket.send("i am the client and i am listening")
}
//監聽消息
socket.onmessage = funciton(event){
console.log('Client received a message',event)
}
//監聽Socket的關閉
socket.onclose = funciotn(event){
console.log("Client notified socket has closed",evnt)
}
//關閉socket
//socket.close()
//代碼解析 ws表示webSocket協議,onopen,onmessage,onclose表示把事件連接到socket實例上,每個事件都提供了一個event,表示socket狀態.
onmessage事件提供了一個data屬性,它可以包含消息的Body部分。消息的Body部分必須是一個字符串，可以進行序列化/反序列化操作，以便傳遞更多的數據
對于不兼容的瀏覽器,可以用Socket.io
// 創建Socket.IO實例，建立連接
var socket= new io.Socket('localhost',{
port: 8080
});
socket.connect();
// 添加一個連接監聽器
socket.on('connect',function() {
console.log('Client has connected to the server!');
});
// 添加一個連接監聽器
socket.on('message',function(data) {
console.log('Received a message from the server!',data);
});
// 添加一個關閉連接的監聽器
socket.on('disconnect',function() {
console.log('The client has disconnected!');
});
// 通過Socket發送一條消息到服務器
function sendMessageToServer(message) {
socket.send(message);
}
Socket.IO簡化了WebSocket API，統一了返回運輸的API。傳輸包括：
WebSocket
Flash Socket
AJAX long-polling
AJAX multipart streaming
IFrame
JSONP polling
參考的http://www.cnblogs.com/wei2yi/archive/2011/03/23/1992830.html網址
