flask websocket

時間 2019-11-30

原文原文鏈接

一.websocket

簡介:

輪詢：javascript

玉帝不定的傳達室 - 凌霄寶殿 - 一秒鐘100次html

開啓高速公路(帶寬) - 佔用網絡帶寬
java

先後端一秒鐘交互屢次
先後端壓力極大
而且帶寬消耗
資源浪費極其嚴重

長輪詢：web

玉帝在傳達室蓋了幾個宿舍住着玉帝的小弟json

讓服務器保存個人一個鏈接狀態，用於快速傳遞消息
節省帶寬釋放壓力
數據實時性

長鏈接''flask

websocket
    玉帝按電話了，而且把電話號碼放在傳達室了
    服務端及客戶端節省極大的資源
    能保證數據實時性

使用

首先下載模塊:後端

gevent-websocket服務器

引用模塊websocket

from flask import Flask,render_template,request
from geventwebsocket.handler import WebSocketHandler
from geventwebsocket.websocket import WebSocket
from gevent.pywsgi import WSGIServer
import json

流程就是

客戶端經過登陸連接那把""傘"",網絡

在服務端建立一個字典user_socket_dict={},以用戶名登陸做爲建存儲許多把傘

客戶端發送字典數據

"to_user":to_user,
"msg":msg

服務端經過

to_user = msg_dict.get("to_user")

存儲

再有放在字典user_socket_dict={},經過登陸用戶名找到發送的那把傘

u_socket = user_socket_dict.get(to_user)

最後發送數據返回客戶端

服務端.py

user_socket_dict={}

@app.route("/ws/<username>")#同flask的路由，username是爲了區分用戶名
def we(username):

    user_socket = request.environ.get('wsgi.websocket')#type:WebSocket  #至關於鏈接的那把傘，成功鏈接後意味着能夠進行通訊了
    ##type:WebSocket ：做用，使定義的user_socket擁有不少屬性
    if user_socket:
        user_socket_dict[username]=user_socket#將用戶登陸時對信息存儲,爲了下次找到發送的對象
    while 1:
        msg = user_socket.receive()#經過"傘".receive()接收那個信息數據
        msg_dict = json.loads(msg)
        msg_dict["from_user"]=username#返回客戶端發送數據的用戶名
        to_user = msg_dict.get("to_user")
        u_socket = user_socket_dict.get(to_user) #type:WebSocket  #找到要發送數據的的人
        # 經過"傘".receive()獲取那個信息 找出send屬性
        u_socket.send(json.dumps(msg_dict))  #經過後端發送給要發送的人,服務器模擬發送,u_socket就是那把傘
        #經過"傘".send發送數據

@app.route("/")
def index():
    return render_template("ws.html")


if __name__ == '__main__':
        http_serv = WSGIServer(('0.0.0.0', 9527), app, handler_class=WebSocketHandler)#找對象
        http_serv.serve_forever()#對象的屬性

客戶端.tml

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="text" id="username"><button onclick="login()">登陸聊天室</button>
給 <input type="text" id="">
發送:<input type="text" id="msg"><button onclick="send_msg()">發送</button>
<div id="chat_list" style="width: 500px;height: 500px"></div>
</body>

<script type="application/javascript">
    var ws = null;
    function login() {
        var username = document.getElementById("username").value;
        ws = new  WebSocket("ws://192.168.72.1:9527/ws/"+username);
        ws.onmessage=function (data) {
            {#  經過ws 按個"傘".onmessage接收數據 data.data獲取出傳來的數據#}
            console.log(data.data)
            var recv_msg = JSON.parse(data.data);
            var ptag = document.createElement("p"); #定義一個標籤p
            ptag.innerText=recv_msg.from_user + ":" + recv_msg.msg;
            document.getElementById("chat_list").appendChild(ptag);
        }
    }


    function send_msg() {
        {#獲取發送者和數據信息#}
        var to_user = document.getElementById("to_user").value;
        var msg = document.getElementById("msg").value;
        var send_str ={
            "to_user":to_user,
            "msg":msg
        };
        ws.send(JSON.stringify(send_str));

    }
</script>
</html>

1. Flask - WebSocket
2. Flask--WebSocket
3. Flask websocket
4. flask使用websocket
5. WebSocket with Flask
6. 【Flask】 flask-socketio實現WebSocket
7. nginx+flask+gevent+uwsgi實現websocket
8. 在flask中使用WebSocket
9. flask python geventwebsocket實現websocket
10. 結合manage.py，在flask項目中使用websocket模塊--- flask-socketio
更多相關文章...
• Docker Compose - Docker教程
• Docker 容器使用 - Docker教程

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。