概述:
WebSocket 是什麼?
WebSocket 是 HTML5 提供的一種瀏覽器與服務器間進行全雙工通信的協議。依靠這種協議能夠實現客戶端和服務器端 ,一次握手,雙向實時通訊。html
WebSocket 服務端:
用的是 dwebsocket,安裝命令pip install dwebsocket.前端
WebSocket 基本方法:
1.request.is_websocket()
若是是個websocket請求返回True,若是是個普通的http請求返回False,能夠用這個方法區分它們。
2.request.websocket
在一個websocket請求創建以後,這個請求將會有一個websocket屬性,用來給客戶端提供一個簡單的api通信,若是request.is_websocket()是False,這個屬性將是None。
3.WebSocket.wait()
返回一個客戶端發送的信息,在客戶端關閉鏈接以前他不會返回任何值,這種狀況下,方法將返回None
4.WebSocket.read()
若是沒有從客戶端接收到新的消息,read方法會返回一個新的消息,若是沒有,就不返回。這是一個替代wait的非阻塞方法
5.WebSocket.count_messages()
返回消息隊列數量
6.WebSocket.has_messages()
若是有新消息返回True,不然返回False
7.WebSocket.send(message)
向客戶端發送消息
8.WebSocket.__iter__()
websocket迭代器web
客戶端:redis
這是客戶端的一些說明,在客戶端,websocket的兩個屬性:readyState和bufferedAmount,區別和說明以下:json
根據readyState屬性能夠判斷webSocket的鏈接狀態,該屬性的值能夠是下面幾種:
0 :對應常量CONNECTING (numeric value 0),
正在創建鏈接鏈接,尚未完成。The connection has not yet been established.
1 :對應常量OPEN (numeric value 1),
鏈接成功創建,能夠進行通訊。The WebSocket connection is established and communication is possible.
2 :對應常量CLOSING (numeric value 2)
鏈接正在進行關閉握手,即將關閉。The connection is going through the closing handshake.
3 : 對應常量CLOSED (numeric value 3)
鏈接已經關閉或者根本沒有創建。The connection has been closed or could not be opened.後端
根據bufferedAmount能夠知道有多少字節的數據等待發送,若websocket已經調用了close方法則該屬性將一直增加。
api
代碼簡單實現:瀏覽器
views.py:服務器
import redis
from dwebsocket.decorators import accept_websocket
r = redis.Redis(host='localhost', port=6379)
使用全局變量
data = ''
#接受前端信息 socket
@accept_websocket
def test_socket(request):
調用全局變量
global data
判斷是不是websocket
if request.is_websocket():
for message in request.websocket:
data = message.decode()
print(data)
# request.websocket.send(message)
@accept_websocket
def test_websocket(request):
調用全局變量
global data
# data = data.decode()
判斷是不是websocket請求
if request.is_websocket():
while 循環一次
while 1:
time.sleep(1) ## 向前端發送時間
判斷是否有值,若是有返回日期仍是data中的數據
if data:
dit = {
'time':time.strftime('%Y.%m.%d %H:%M:%S',time.localtime(time.time())),
'data': data
}
request.websocket.send(json.dumps(dit))
循環一次以後賦值爲空
data = ''
路由url.py:
# 推送
path('/socket_test',TemplateView.as_view(template_name='md_admin_user/socket.html')),
path('/websocket_test',TemplateView.as_view(template_name='md_admin_user/socket_push.html')),
path('/test_socket',test_socket),
path('/test_websocket',test_websocket),
後端html:
<body>
<input id="chat-message-input" type="text" size="100"/><br/>
<input id="chat-message-submit" type="button" value="Send" onclick='sendmessage()'/>
</body>
<script>
var websocket
//生成socket對象
var socket = new WebSocket("ws:" + window.location.host + "/md_admin_user/test_socket");
socket.onopen = function () {
console.log('WebSocket open');//成功鏈接上Websocket
};
socket.onmessage = function (e) {
console.log('message: ' + e.data);//打印服務端返回的數據
};
socket.onclose=function(e){
console.log(e);
socket.close(); //關閉TCP鏈接
};
if (socket.readyState == WebSocket.OPEN){
socket.onopen();
}
window.s = socket;
function sendmessage(){
window.s.send(document.getElementById("chat-message-input").value);
}
</script>
前端html:
<script>
//生成socket對象
var socket = new WebSocket("ws:localhost:8000/md_admin_user/test_websocket");
socket.onopen = function () {
console.log('WebSocket open');//成功鏈接上Websocket
};
socket.onmessage = function (e) {
console.log('message: ' + e.data);//打印服務端返回的數據
};
socket.onclose=function(e){
console.log(e);
socket.close(); //關閉TCP鏈接
};
if (socket.readyState == WebSocket.OPEN){
socket.onopen();
}
</script>