python + django + dwebsocket 實現簡單的聊天室
阿新 • • 發佈：2018-12-12
使用庫dwebsocket，具體參考此處
views.py:
from dwebsocket.decorators import accept_websocket,require_websocket from collections import defaultdict # 儲存所有接入的使用者地址 allconn = defaultdict(list) @accept_websocket def echo(request, userid): allresult = {} # 獲取使用者資訊 userinfo = request.user allresult['userinfo'] = userinfo # 宣告全域性變數 global allconn if not request.is_websocket():#判斷是不是websocket連線 try:#如果是普通的http方法 message = request.GET['message'] return HttpResponse(message) except: return render(request, 'myproject/chat.html', allresult)else: # 將連結(請求？)存入全域性字典中 allconn[str(userid)] = request.websocket # 遍歷請求地址中的訊息 for message in request.websocket: # 將資訊發至自己的聊天框 request.websocket.send(message) # 將資訊發至其他所有使用者的聊天框 for i in allconn:if i != str(userid): allconn[i].send(message)
chat.html :
<!DOCTYPE html> <html> <head> <title>django-websocket</title> <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $(document).ready(function () { // 獲取當前時間的函式 function getNowFormatDate() { var date = new Date(); var seperator1 = "-"; var seperator2 = ":"; var month = date.getMonth() + 1; var strDate = date.getDate(); if (month >= 1 && month <= 9) { month = "0" + month; } if (strDate >= 0 && strDate <= 9) { strDate = "0" + strDate; } var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + " " + date.getHours() + seperator2 + date.getMinutes() + seperator2 + date.getSeconds(); return currentdate; } $('#connect_websocket').click(function () { if (window.s) { window.s.close() }; /*建立socket連線*/ var socket = new WebSocket("ws://" + window.location.host + "/myproject/echo/" + $('#userid').val()); socket.onopen = function () { console.log('WebSocket open');//成功連線上Websocket }; socket.onmessage = function (e) { console.log('message: ' + e.data);//打印出服務端返回過來的資料 $('#messagecontainer').prepend('<p>' + e.data + '</p>'); }; // Call onopen directly if socket is already open if (socket.readyState === WebSocket.OPEN) socket.onopen(); window.s = socket; }); $('#send_message').click(function () { //如果未連線到websocket if (!window.s) { alert("websocket未連線."); } else { window.s.send($('#username').val() + ' ' + getNowFormatDate() + ':<br>' + $('#message').val());//通過websocket傳送資料 } }); $('#close_websocket').click(function () { if (window.s) { window.s.close();//關閉websocket console.log('websocket已關閉'); } }); }); </script> </head> <body> <br> <input type="hidden" id="userid" value="{{ userinfo.id }}"/> <input type="hidden" id="username" value="{{ userinfo.username }}"/> <input type="text" id="message" value="Hello, World!"/> <button type="button" id="connect_websocket">連線 websocket</button> <button type="button" id="send_message">傳送 message</button> <button type="button" id="close_websocket">關閉 websocket</button> <h1>Received Messages</h1> <div id="messagecontainer"> </div> </body> </html>
urls.py :
url(r'^echo/(?P<userid>[0-9]+)$', views.echo, name='echo'),