轮询、WebSocket
长/短连接
- 短链接:所谓短链接,及连接只保持在数据传输过程,请求发起,连接建立,数据返回,连接关闭。它适用于一些实时数据请求,配合轮询来进行新旧数据的更替。
- 长连接:长连接便是在连接发起后,在请求关闭连接前客户端和服务端都保持连接,实质是保持这个通信管道,之后便可以对其进行复用。它适用于涉及消息推送,请求频繁的场景(直播,流媒体)。连接建立后,在该连接下的所有请求都可以重用这个长连接通道,避免了频繁连接请求,提升了效率。
长/短轮询
- 短轮询:短轮询指的是在循环周期内,不断发起请求,每一次请求都立即返回结果,根据新旧数据对比决定是否使用这个结果。
- 长轮询:而长轮询则是在请求的过程中,若是服务器端数据并没有更新,那么则将这个连接挂起,直到服务器推送新的数据,再返回,然后在进入循环周期。
代码
短轮询:设置一个定时器,定时询问服务器是否有信息,每次建立连接传输数据之后,连接会关闭。
var polling = function (url, type, data) {
var xhr = new XMLHttpRequest(),
type = type || "GET",
data = data | null;
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
reveive(xhr.responseText);
xhr.onreadystatechange = null;
}
};
xhr.open(type, url, true);
xhr.send(type == "GET" ? null : data);
};
var timer = setInterval(function () {
polling;
}, 1000);
长轮询:在xhr对象关闭连接的时候马上又给他接上
// 长轮询
var longPoll = function (type, url) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
receive(xhr.responseText);
xhr.onreadystatechange = null;
longPoll(type, url);
}
};
xhr.open(type, url, true);
xhr.send();
};
WebSocket
WebSocket是全双工、双向、单套接字连接。WebSocket是一个底层网络协议,可以在它的基础上构建其他标准协议。
一旦建立起WebSocket请求,不需要客户端发起,客户端也能及时接收到来自服务端的数据。
代码
var ws = new WebSocket("ws:www.example.com:8888");
ws.onopen = function (evt) {};
ws.onmessage = function (evt) {
deal(evt.data);
};
ws.onclose = function (evt) {};
ws.send(data)
// ws.close()