三种通信模型简述:
(1)轮询:
客户端周期性不间断高频率的给服务器发送请求:
客户端请求–服务器响应–断开连接,请求次数QPS比较频繁,对客户端和服务器的配置要求比较高
(2)长轮询:
客户端周期性不间断的给服务器发送请求:
客户端与服务器建立的连接会保持一定时间,因此请求相对不会特别频繁
(3)长连接:
客户端与服务端建立连接后,如果不是特殊原因(客户端主动断开,服务器故障)连接会一直保持
同时通过多线程进行IO多路复用技术解决并发问题
flask中基于gevent-websocket的IO多路复用技术进行长连接通信:
(1)基于gevent-websocket的IO多路复用长连接通信,需要导入一下模块:
#pip install gevent-websocket导入IO多路复用模块
from geventwebsocket.handler import WebSocketHandler #提供WS(websocket)协议处理
from geventwebsocket.server import WSGIServer #websocket服务承载
#WSGIServer导入的就是gevent.pywsgi中的类
# from gevent.pywsgi import WSGIServer
from geventwebsocket.websocket import WebSocket #websocket语法提示
(2)路由视图函数中的处理必须通过request.environ.get(‘wsgi.websocket’)获取与客户端的ws连接client_socket:
#websocket协议通信如下(http请求正常处理即可)
@app.route()
def func():
client_socket=request.environ.get('wsgi.websocket')
while 1:
client_socket.recive()
...
client_socket.send(str)
...
(3)flask项目启动如下:
WSGIServer默认处理的是http请求,路由视图中可以正常使用http,
但是在使用ws协议时务必在视图函数通过request.environ.get(‘wsgi.websocket’)获取与客户端的ws连接client_socket,
通过连接client_socket进行client_socket.recive()/client_socket.send()通信,这连个方法会对字符串自动进行编解码)
http_server=WSGIServer(('192.168.16.14',8888),application=app,handler_class=WebSocketHandler。
http_server.serve_forever()
(4)前端页面使用js进行WS(websocket)请求:
浏览器提供了websocket客户端,直接new创建websocket连接ws,(ws状态码0表示已创建未连接,1表示已连接保持中,2表示客户端主动断开连接,3表示服务端断开连接),通过ws.onmessage=function (MessageEvent){}
监听执行回调函数获取信息MessageEvent.data, 通过ws.send()
发送信息。
<script>
var ws = new WebSocket('ws://192.168.16.14:8888/websocket');
ws.onmessage = function (MessageEvent) {
console.log(MessageEvent);
console.log(MessageEvent.data);
};
function send() {
var msg = document.getElementById('msg').value;
ws.send(msg);
}
</script>
http请求协议和websocket请求协议的请求原数据request.environ和请求头部信息request.headers比较:
http-environ:
{
'GATEWAY_INTERFACE': 'CGI/1.1', 'SERVER_SOFTWARE': 'gevent/1.4 Python/3.6',
'SCRIPT_NAME': '', 'wsgi.version': (1, 0),
'wsgi.multithread': False, 'wsgi.multiprocess': False,
'wsgi.run_once': False, 'wsgi.url_scheme': 'http',
'wsgi.errors': <_io.TextIOWrapper name='<stderr>' mode='w' encoding='UTF-8'>,
'SERVER_NAME': 'PC-Yang', 'SERVER_PORT': '8888', 'REQUEST_METHOD': 'GET',
'PATH_INFO': '/websocket', 'QUERY_STRING': '', 'SERVER_PROTOCOL': 'HTTP/1.1',
'REMOTE_ADDR': '192.168.16.14', 'REMOTE_PORT': '61539', 'HTTP_HOST': '192.168.16.14:8888',
'HTTP_CONNECTION': 'keep-alive', 'HTTP_PRAGMA': 'no-cache', 'HTTP_CACHE_CONTROL': 'no-cache',
'HTTP_UPGRADE_INSECURE_REQUESTS': '1',
'HTTP_USER_AGENT': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36',
'HTTP_ACCEPT': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3',
'HTTP_ACCEPT_ENCODING': 'gzip, deflate', 'HTTP_ACCEPT_LANGUAGE': 'zh-CN,zh;q=0.9',
'wsgi.input': <gevent.pywsgi.Input object at 0x03A9DC00>,
'wsgi.input_terminated': True, 'werkzeug.request': <Request 'http://192.168.16.14:8888/websocket' [GET]>
}
http-headers:
'''
Host: 192.168.16.14:8888
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3
Accept-Encoding: gzip, deflate
Accept-Language: zh-CN,zh;q=0.9
websocket-environ: ‘wsgi.websocket’: <geventwebsocket.websocket.WebSocket object at 0x03A9DC00>,websocket连接
'''
{
'GATEWAY_INTERFACE': 'CGI/1.1', 'SERVER_SOFTWARE': 'gevent/1.4 Python/3.6',
'SCRIPT_NAME': '', 'wsgi.version': (1, 0), 'wsgi.multithread': False,
'wsgi.multiprocess': False, 'wsgi.run_once': False, 'wsgi.url_scheme': 'http',
'wsgi.errors': <_io.TextIOWrapper name='<stderr>' mode='w' encoding='UTF-8'>,
'SERVER_NAME': 'PC-Yang', 'SERVER_PORT': '8888', 'REQUEST_METHOD': 'GET',
'PATH_INFO': '/websocket', 'QUERY_STRING': '', 'SERVER_PROTOCOL': 'HTTP/1.1',
'REMOTE_ADDR': '192.168.16.14', 'REMOTE_PORT': '61591', 'HTTP_HOST': '192.168.16.14:8888',
'HTTP_CONNECTION': 'Upgrade', 'HTTP_PRAGMA': 'no-cache', 'HTTP_CACHE_CONTROL': 'no-cache',
'HTTP_USER_AGENT': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36',
'HTTP_UPGRADE': 'websocket', 'HTTP_ORIGIN': 'http://192.168.16.14:8888', 'HTTP_SEC_WEBSOCKET_VERSION': '13',
'HTTP_ACCEPT_ENCODING': 'gzip, deflate', 'HTTP_ACCEPT_LANGUAGE': 'zh-CN,zh;q=0.9',
'HTTP_SEC_WEBSOCKET_KEY': 'Oyfq0MCEBnsypKstjjRvYg==',
'HTTP_SEC_WEBSOCKET_EXTENSIONS': 'permessage-deflate; client_max_window_bits',
'wsgi.input': <gevent.pywsgi.Input object at 0x03A9DCA8>,
'wsgi.input_terminated': True, 'wsgi.websocket_version': '13',
'wsgi.websocket': <geventwebsocket.websocket.WebSocket object at 0x03A9DC00>,
'werkzeug.request': <Request 'http://192.168.16.14:8888/websocket' [GET]>
}
'''
websocket-headers: Upgrade: websocket #websocket请求中的标识
'''
Host: 192.168.16.14:8888
Connection: Upgrade
Pragma: no-cache
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36
Upgrade: websocket #websocket请求中的标识
Origin: http://192.168.16.14:8888
Sec-Websocket-Version: 13
Accept-Encoding: gzip, deflate
Accept-Language: zh-CN,zh;q=0.9
Sec-Websocket-Key: Oyfq0MCEBnsypKstjjRvYg==
Sec-Websocket-Extensions: permessage-deflate; client_max_window_bits
'''
websocket-headers
(1)基于websocket+flask实现的群聊无昵称即时通信
flask_websocket(MUC_Nonick).py
1 '''
2 基于websocket+flask实现的群聊无昵称即时通信
3 设计列表client_list = []来存储客户端与服务器的连接,
4 服务收到任意客户端的信息(信息时),对连接存储列表进行遍历获取每个连接,直接进行转发
5 '''
6 from flask import Flask, render_template, request
7
8 # pip install gevent-websocket导入IO多路复用模块
9 from geventwebsocket.handler import WebSocketHandler # 提供WS(websocket)协议处理
10 from geventwebsocket.server import WSGIServer # websocket服务承载
11 # WSGIServer导入的就是gevent.pywsgi中的类
12 # from gevent.pywsgi import WSGIServer
13 from geventwebsocket.websocket import WebSocket # websocket语法提示
14
15 app = Flask(__name__)
16
17 # @app.route('/websocket')
18 # 多个客户端可以同时给falsk服务端发送ws协议的信息
19 # def websocket():
20 # client_socket=request.environ.get('wsgi.websocket') #type:WebSocket
21 # while 1:
22 # msg_from_cli=client_socket.receive()
23 # print(msg_from_cli)
24 # 多个客户端可以同时给falsk服务端发送ws协议的信息,同时服务端将信息转送到每个客户端页面,实现多人聊天室即时通信
25 client_list = []
26
27
28 @app.route('/websocket')
29 def websocket():
30 client_socket = request.environ.get('wsgi.websocket') # type:WebSocket
31 client_list.append(client_socket)
32 # print(len(client_list), client_list)
33 while 1:
34 msg_from_cli = client_socket.receive()
35 # print(msg_from_cli)
36 #收到任何一个客户端的信息都进行全部转发(注意如果某个客户端连接断开,在遍历发送时连接不存在会报错,需要异常处理)
37 for client in client_list:
38 try:
39 client.send(msg_from_cli)
40 except Exception as e:
41 continue
42
43 @app.route('/chat')
44 def chat():
45 return render_template('MUC_Nonick.html')
46
47
48 if __name__ == '__main__':
49 # app.run('192.168.16.14',8888,debug=True)
50 http_server = WSGIServer(('192.168.16.14', 8888), application=app, handler_class=WebSocketHandler)
51 http_server.serve_forever()
flask_websocket(MUC_Nonick).py
MUC_Nonick.html
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>多用户聊天无昵称</title>
6 </head>
7 <body>
8 <div id="chat_room">
9 <p>请输入聊天内容:<input type="text" id="msg">
10 <button id="send" onclick="send()">发送</button>
11 </p>
12 <div id="chat_content"></div>
13 </div>
14 </body>
15 <script type="application/javascript">
16 var ws = new WebSocket('ws://192.168.16.14:8888/websocket');
17 ws.onmessage = function (MessageEvent) {
18 //console.log(MessageEvent);
19 //console.log(MessageEvent.data);
20 var time=new Date();
21 var t= time.toLocaleString();
22 var p=document.createElement("p");
23 p.innerText="("+t+")"+MessageEvent.data;
24 document.getElementById('chat_content').appendChild(p);
25 };
26
27 function send() {
28 var msg = document.getElementById('msg').value;
29 ws.send(msg);
30 }
31 </script>
32 </html>
MUC_Nonick.html
(2)基于websocket+flask实现的群聊有昵称即时通信
版本一:通过动态路有参数获取客户端昵称:
flask_websocket(MUC_nick_route).py
1 '''
2 基于websocket+flask实现的群聊即时通信
3 设计字典client_dict = {}来存储{客户端的名字:客户端与服务器的连接},客户端的名字通过动态路由参数获取到,
4 服务器接收客户端发来的信息(经过json序列化后的字典),对存储连接信息的字典进行遍历,获取客户端的连接,直接转发
5 '''
6 from flask import Flask, render_template, request
7 from geventwebsocket.handler import WebSocketHandler # 提供WS(websocket)协议处理
8 from geventwebsocket.server import WSGIServer # websocket服务承载
9 from geventwebsocket.websocket import WebSocket # websocket语法提示
10
11 app = Flask(__name__)
12
13 client_dict = {}
14
15
16 @app.route('/websocket/<client_name>')#通过动态路由参数获取昵称,必须在视图函定义同名形参接收
17 def websocket(client_name):
18 client_socket = request.environ.get('wsgi.websocket') # type:WebSocket
19 client_dict[client_name] = client_socket
20 # print(len(client_dict), client_dict)
21 while 1:
22 msg_from_cli = client_socket.receive()
23 for client in client_dict.values():
24 try:
25 client.send(msg_from_cli)
26 except Exception as e:
27 continue
28
29
30 @app.route('/chat')
31 def chat():
32 return render_template('MUC_nick_route.html')
33
34
35 if __name__ == '__main__':
36 # app.run('192.168.16.14',8888,debug=True)
37 http_server = WSGIServer(('192.168.16.14', 8888), application=app, handler_class=WebSocketHandler)
38 http_server.serve_forever()
flask_websocket(MUC_nick_route).py
MUC_nick_route.html
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>多用户聊天无昵称</title>
6 </head>
7 <body>
8 <div id="chat_room">
9 <p>输入昵称进入多人聊天室:<input type="text" id="client_name"></input>
10 <button id='login' onclick="login()">登录</button>
11 </p>
12 <p id='chat_msg' hidden="hidden">请输入聊天内容:<input type="text" id="msg">
13 <button id="send" onclick="send()">发送</button>
14 </p>
15 <div id="chat_content" hidden="hidden"></div>
16 </div>
17 </body>
18 <script type="application/javascript">
19 var ws = null;
20 var name=null;
21
22 function login() {
23 document.getElementById('login').setAttribute('hidden', 'hidden');
24 document.getElementById('client_name').setAttribute('disabled', 'disabled');
25 document.getElementById('chat_msg').removeAttribute('hidden');
26 document.getElementById('chat_content').removeAttribute('hidden');
27 name = document.getElementById('client_name').value;
28 //进行WS实例化
29 ws = new WebSocket('ws://192.168.16.14:8888/websocket/' + name);
30
31 //监听服务器发来的消息(json数据)
32 ws.onmessage = function (MessageEvent) {
33 //console.log(MessageEvent);
34 //console.log(MessageEvent.data);
35 var content_str = JSON.parse(MessageEvent.data);
36 var time = new Date();
37 var t = time.toLocaleTimeString();
38 var p = document.createElement("p");
39 p.innerText = content_str.name + "(" + t + "):" + content_str.msg;
40 document.getElementById('chat_content').appendChild(p);
41 };
42 };
43
44
45 //聊天信息发送(json数据)
46 function send() {
47 var msg = document.getElementById('msg').value;
48 var data = {
49 name: name,
50 msg: msg,
51 };
52 var data_json = JSON.stringify(data);
53 ws.send(data_json);
54 }
55 </script>
56 </html>
MUC_nick_route.html
版本二:通过websocket接收客户端发来基于websocket发来的昵称:
flask_websocket(MUC_nick).py
1 '''
2 基于websocket+flask实现的群聊即时通信
3 设计字典client_dict = {}来存储{客户端的名字:客户端与服务器的连接},客户端的名字通过客户端执行WS请求协议发送获取,
4 服务器再持续接收客户端发来的信息(经过json序列化后的字典),对存储连接信息的字典进行遍历,获取客户端的连接,直接转发
5 '''
6 from flask import Flask, render_template, request
7 from geventwebsocket.handler import WebSocketHandler # 提供WS(websocket)协议处理
8 from geventwebsocket.server import WSGIServer # websocket服务承载
9 from geventwebsocket.websocket import WebSocket # websocket语法提示
10
11
12 app = Flask(__name__)
13
14 client_dict = {}
15
16
17 @app.route('/websocket')
18 def websocket():
19 client_socket = request.environ.get('wsgi.websocket') # type:WebSocket
20 # print(client_socket)
21 client_name = client_socket.receive()
22 client_dict[client_name] = client_socket
23 # print(len(client_dict), client_dict)
24 while 1:
25 msg_from_cli = client_socket.receive()
26 # msg_from_cli_str=json.loads(msg_from_cli)
27 # print(msg_from_cli_str)
28 for client in client_dict.values():
29 try:
30 client.send(msg_from_cli)
31 except Exception as e:
32 continue
33
34
35 @app.route('/chat')
36 def chat():
37 return render_template('MUC_nick.html')
38
39
40 if __name__ == '__main__':
41 # app.run('192.168.16.14',8888,debug=True)
42 http_server = WSGIServer(('192.168.16.14', 8888), application=app, handler_class=WebSocketHandler)
43 http_server.serve_forever()
flask_websocket(MUC_nick).py
MUC_nick.html
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>多用户聊天无昵称</title>
6 </head>
7 <body>
8 <div id="chat_room">
9 <p>输入昵称进入多人聊天室:<input type="text" id="client_name"></input>
10 <button id='login' onclick="login()">登录</button>
11 </p>
12 <p id='chat_msg' hidden="hidden">请输入聊天内容:<input type="text" id="msg">
13 <button id="send" onclick="send()">发送</button>
14 </p>
15 <div id="chat_content" ></div>
16 </div>
17 </body>
18 <script type="application/javascript">
19 var ws = new WebSocket('ws://192.168.16.14:8888/websocket');
20 var name = null;
21
22 //向服务端发送本机昵称
23 function login() {
24 document.getElementById('login').setAttribute('hidden', 'hidden');
25 document.getElementById('client_name').setAttribute('disabled', 'disabled');
26 document.getElementById('chat_msg').removeAttribute('hidden');
27 document.getElementById('chat_content').removeAttribute('hidden');
28 name = document.getElementById('client_name').value;
29 ws.send(name);
30 };
31
32
33 //监听服务器发来的消息(json数据)
34 ws.onmessage = function (MessageEvent) {
35 //console.log(MessageEvent);
36 //console.log(MessageEvent.data);
37 var content_str = JSON.parse(MessageEvent.data);
38 var time = new Date();
39 var t = time.toLocaleTimeString();
40 var p = document.createElement("p");
41 p.innerText = content_str.name + "(" + t + "):" + content_str.msg;
42 document.getElementById('chat_content').appendChild(p);
43 };
44
45
46 //聊天信息发送(json数据)
47 function send() {
48 var msg = document.getElementById('msg').value;
49 var data = {
50 name: name,
51 msg: msg
52 };
53 var data_json = JSON.stringify(data);
54 ws.send(data_json);
55 }
56 </script>
57 </html>
MUC_nick.html
(3)基于websocket+flask实现的私聊即时通信
flask_websocket(Private_chat).py
1 '''
2 基于websocket+flask实现的私聊即时通信
3 设计字典client_dict = {}来存储{客户端的名字:客户端与服务器的连接},客户端的名字通过动态路由参数获取到,
4 服务器通过客户端发来的信息(经过json序列化后的字典)中的目标客户端名字,在存储字典中获取目标客户端的连接,直接转发
5 '''
6 from flask import Flask, render_template, request
7 from geventwebsocket.handler import WebSocketHandler # 提供WS(websocket)协议处理
8 from geventwebsocket.server import WSGIServer # websocket服务承载
9 from geventwebsocket.websocket import WebSocket # websocket语法提示
10 import json
11
12 app = Flask(__name__)
13
14 client_dict = {}
15
16
17 @app.route('/websocket/<client_name>') # 通过动态路由参数获取昵称,必须在视图函定义同名形参接收
18 def websocket(client_name):
19 client_socket = request.environ.get('wsgi.websocket') # type:WebSocket
20 client_dict[client_name] = client_socket
21 if client_socket:
22 while 1:
23 msg_from_cli = client_socket.receive()
24 to_client = json.loads(msg_from_cli).get('to_client')
25 client = client_dict.get(to_client)
26 try:
27 client.send(msg_from_cli)
28 except Exception as e:
29 continue
30
31
32 @app.route('/chat')
33 def chat():
34 return render_template('Private_chat.html')
35
36
37 if __name__ == '__main__':
38 http_server = WSGIServer(('192.168.16.14', 8888), application=app, handler_class=WebSocketHandler)
39 http_server.serve_forever()
flask_websocket(Private_chat).py
Private_chat.html
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>单人聊天室</title>
6
7 </head>
8 <body>
9 <div id="chat_room">
10 <p>输入昵称进入单人聊天室:<input type="text" id="client_name"></input>
11 <button id='login' onclick="login()">登录</button>
12 </p>
13 <p hidden id="client_recv">收信人:<input type="text" id="to_client"></p>
14 <p id='chat_msg' hidden="hidden">请输入聊天内容:<input type="text" id="msg">
15
16 <button id="send" onclick="send()">发送</button>
17 </p>
18 <div id="chat_content" hidden="hidden"></div>
19 </div>
20 </body>
21 <script type="application/javascript">
22 var ws = null;
23 var name=null;
24
25 function login() {
26 document.getElementById('login').setAttribute('hidden', 'hidden');
27 document.getElementById('client_name').setAttribute('disabled', 'disabled');
28 document.getElementById('chat_msg').removeAttribute('hidden');
29 document.getElementById('chat_content').removeAttribute('hidden');
30 document.getElementById('client_recv').removeAttribute('hidden');
31
32 name = document.getElementById('client_name').value;
33 //进行WS实例化
34 ws = new WebSocket('ws://192.168.16.14:8888/websocket/' + name);
35
36 //监听服务器发来的消息(json数据)
37 ws.onmessage = function (MessageEvent) {
38 //console.log(MessageEvent);
39 //console.log(MessageEvent.data);
40 var content_str = JSON.parse(MessageEvent.data);
41 var time = new Date();
42 var t = time.toLocaleTimeString();
43 var p = document.createElement("p");
44 p.innerText = content_str.name + "(" + t + "):" + content_str.msg;
45 document.getElementById('chat_content').appendChild(p);
46 };
47 };
48
49
50 //聊天信息发送(json数据)
51 function send() {
52 var msg = document.getElementById('msg').value;
53 var to_client=document.getElementById('to_client').value;
54 var data = {
55 name: name,
56 msg: msg,
57 to_client:to_client
58 };
59
60 var data_json = JSON.stringify(data);
61 ws.send(data_json);
62
63
64 var time = new Date();
65 var t = time.toLocaleTimeString();
66 var p = document.createElement("p");
67 p.innerText = name + "(" + t + "):" + msg;
68 document.getElementById('chat_content').appendChild(p);
69
70
71
72
73
74 }
75 </script>
76 </html>
Private_chat.html
实际项目后台代码:
#! /usr/bin/python2
#! -*- coding:utf-8 -*-
from flask import Flask,request
from gevent import monkey
from gevent.pywsgi import WSGIServer
from geventwebsocket.handler import WebSocketHandler
import time
import json
import sys
import traceback
import logging
from InteractiveWithDatabase.interactive_with_database import Get_first_record_from_database
from pub.const_redis import SYSTEM_KEY_NAME
from MEO_DB import redisLifecycle
monkey.patch_all() #支持异步请求
app = Flask(__name__)
app.config.update(
DEBUG=True
)
logger = logging.getLogger('eb_meo')
@app.route("/conn_vnfm")
def ws_app():
user_socket = request.environ.get("wsgi.websocket")
sys_id = user_socket.receive()
subsDb = Get_first_record_from_database('Alarm_subscription', system_id=sys_id)
try:
if subsDb:
SrcType = subsDb.sub_type
while True:
if redisLifecycle.get(SYSTEM_KEY_NAME.HeartBeat + SrcType.lower() + '_' + sys_id):
user_socket.send(json.dumps({sys_id:True}))
else:
user_socket.send(json.dumps({sys_id:False}))
time.sleep(subsDb.heartbeat)
else:
user_socket.send(json.dumps({sys_id:False}))
except:
logger.debug(sys.exc_info())
logger.debug(traceback.format_exc())
return ''
# 服务器端没关闭之前必须有接收阻塞,否则服务器和客户端都会死循环而崩溃
# websocket的原理:客户端发送消息请求,服务器端回复数据【客户端不发消息,循环不会阻塞就是死循环】
if __name__ == '__main__':
http_serv=WSGIServer(("0.0.0.0",int(sys.argv[1])),app,handler_class=WebSocketHandler)
http_serv.serve_forever()
实际项目前端处理:
{% block scripts %}
{{super()}}
<script type="text/javascript" src="{{url_for('static',filename = 'js/system.js')}}"></script>
<script>
//接入系统连接状态持续监控功能
var web_socket_msg = {{extraData|tojson}}
console.log(web_socket_msg)
var vnfms = {{resData.vnfms|tojson}}
function con_svr(vnfm_id){
// 协议为ws,和http配合 wws,和HTTPS配合使用
let ws = new WebSocket('ws://' + web_socket_msg.ip + ':' + String(web_socket_msg.port) + '/conn_vnfm')
ws.onopen = function (params) {
console.log(vnfm_id + '连接成功')
ws.send(vnfm_id)
}
ws.onmessage = function (e) {
console.log(vnfm_id + '收到服务器响应', e.data)
var res = JSON.parse(e.data)
if (res[vnfm_id]){
$('#status-' + vnfm_id).addClass('glyphicon-ok-sign').css('color','#5CCBB1')
}else{
$('#status-' + vnfm_id).removeClass('glyphicon-ok-sign').css('color','#E54545')
}
}
}
for (let vnfm of vnfms){
con_svr(vnfm.vnfm_id)
}
</script>
{% endblock %}