Django版本 2.1.7 dwebsocket版本0.5.11
安装
pip3 install dwebsocket==0.5.11
使用说明
上面已经安装好了dwebsocket库，那么如何使用呢？ 使用的方法有两种情况，如下：
- 第一种则是利用修饰器的方式单独对某个视图进行增加websocket功能
- 另一种则是在配置文件中设置中间件，配置所有视图都可以接收使用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迭代器
示例1 - 使用修饰器对单个视图启用websocket功能
- 在views.py文件中,将对应的视图函数添加装饰器
accept_websocket-—可以接受websocket请求和普通http请求
require_websocket----只接受websocket请求,拒绝普通http请求
- 编写测试使用的websocket服务端视图
import json
import time from dwebsocket.decorators import accept_websocket,require_websocket @accept_websocket def test_websocket(request): if request.is_websocket(): # 如果请求是websocket请求： i = 0 # 设置发送至前端的次数 while True: i += 1 # 递增次数 i # 休眠1秒 time.sleep(1) # 设置发送前端的数据 messages = { 'time':time.strftime('%Y.%m.%d %H:%M:%S',time.localtime(time.time())), 'msg': 'send %d times!' % i, } # 设置发送数据为json格式 request.websocket.send(json.dumps(messages))
- 设置访问视图的url地址
from .views import * app_name = 'assetinfo' # 设置命名空间 urlpatterns = [ # ex:/assetinfo/test_websocket path('test_websocket', views.test_websocket , name='test_websocket'), ]
- 新建
websocket_client.html在templates文件夹下，编写浏览器websocket的客户端
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="/static/js/jquery-3.0.0.min.js"></script> <script type="text/javascript"> $(function () { $('#send_message').click(function () { var socket = new WebSocket("ws://" + window.location.host + "/assetinfo/test_websocket"); socket.onopen = function () { console.log('WebSocket open');//成功连接上Websocket socket.send($('#message').val());//发送数据到服务端 }; socket.onmessage = function (e) { console.log('message: ' + e.data);//打印服务端返回的数据 $('#messagecontainer').prepend('<p>' + e.data + '</p>'); }; }); }); </script> </head> <body> <input type="text" id="message" value="Open websocket!" /> <button type="button" id="send_message">发送 message</button> <h1>Received Messages</h1> <div id="messagecontainer"></div> </body> </html>
- 编写websocket客户端的视图
def test_websocket_client(request): return render(request,'websocket_client.html')
- 配置websocket客户端访问的url
urlpatterns = [ # ex:/assetinfo/test_websocket_client path('test_websocket_client', views.test_websocket_client , name='test_websocket_client'), ]
- 测试运行的效果
访问客户端：http://127.0.0.1:8000/assetinfo/test_websocket_client
可以看到，已经可以正常得不断从websocket服务端接收到一直刷新的数据。
这里已经可以通过websocket的方式，浏览器作为客户端不断接收服务端发送过来的数据，并进行刷新。
但是在这里有个很明显的缺点，就是没有办法在客户端对websocket进行停止处理，以及重新连接websocket的操作，下面来看看。
示例2 - 使用修饰器方式，增加websocket停止以及重连功能
- 修改
websocket_client.html，增加websocket的停止以及重连js代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="/static/js/jquery-3.0.0.min.js"></script> <script type="text/javascript"> $(function () { // 点击连接websocket按钮，则启动访问websocket $('#connect_websocket').click(function () { if(window.s){ window.s.close() } // 设置websocket的服务端url var s = new WebSocket("ws://" + window.location.host + "/assetinfo/test_websocket"); // 打开连接websocket服务，连接成功则打印信息 s.onopen = function () { console.log('WebSocket open');//成功连接上Websocket }; // 接收服务端发送过来的数据，在浏览器上刷新 s.onmessage = function (e) { console.log('message: ' + e.data);//打印出服务端返回过来的数据 $('#messagecontainer').prepend('<p>' + e.data + '</p>'); }; window.s = s; }); // 点击发送消息按钮，则通过websocket发送数据至服务端 $('#send_message').click(function () { if (!window.s) { alert("Please connect server."); } else { window.s.send($('#message').val());//通过websocket发送数据 } }); // 点击关闭websocket连接 $('#close_websocket').click(function () { if (window.s) { window.s.close();//关闭websocket console.log('websocket is closed!'); } }); }); </script> </head> <body> <input type="text" id="message" value="Open websocket!" /> <button type="button" id="connect_websocket">连接websocket</button> <button type="button" id="send_message">发送 message<