跳至侧栏

HTML5-WebSocket

1.概述
WebSocket是一种比HTTP协议更加高效的网络传输协议,它有效地减少了HTTP头中的冗余信息和网络延时,能够提供客户端-服务器和服务器-客户端的双通道实时通信,同时具有很好的安全机制。基于WebSocket的URL通常以WS://...开头,类似于HTTPS,安全的WebSocket连接URL通常以WSS://...开头。要实现WebSocket通信,需要客户端浏览器支持WebSocket,服务器端也必须支持WebSocket。
WebSocket还具有广播功能,当有多个监听者连接时,广播服务器发送的消息都可被接收到。

2.浏览器支持检测
function loadDemo()
{
if (window.WebSocket)
{
document.getElementById("support").innerHTML = "HTML5 WebSocket is supported in your browser.";
} else
{
document.getElementById("support").innerHTML = "HTML5 WebSocket is not supported in your browser.";
}
}

3.WebSocket对象
WebSocket在DOM中是window对象的子对象,它具有:
•WebSocket(url)构造函数。
•readyState。只读属性,其值可以是CONNECTING(0),OPEN(1),CLOSED(3)。
•boolean send(in DOMString data)和void close()两个方法,分别用于发送消息和关闭WebSocket连接
•onopen, onmessage, 和onclosee三个事件属性,分别对open, message和close三个WebSocket事件。

3.使用WebSocket的步骤
//建立连接
url = "ws://localhost:8080/echo";
w = new WebSocket(url);

//事件监听
w.onopen = function() {
log("open"); w.send("thank you for accepting this websocket request");
}
w.onmessage = function(e) {
log(e.data);
}
w.onclose = function(e) {
log("closed");
}

//发送消息
document.getElementById("sendButton").onclick = function() {
w.send(document.getElementById("inputMessage").value);
}

//关闭连接。一般情况下不关闭,以保持实时通信
w.close();

 

posted @ 2012-12-21 16:52  JiayangShen  阅读(2043)  评论(1编辑  收藏  举报
Top
推荐
收藏
关注
评论