前端+后端python双向通信

前端+后端python双向通信

---

目的

在前后端分离的基础上（不用flask的模板渲染），用后端的flaskio和前端的socketio实现双向通信。

代码

后端python代码，用的是3.7

# -*-encoding: utf-8-*-
# pip install flask-socketio
from flask import Flask
from flask_cors import *
from flask_socketio import SocketIO

app = Flask(__name__)
CORS(app, supports_credentials=True)
socketio = SocketIO()
socketio.init_app(app, cors_allowed_origins='*')

name_space = '/dcenter'  # socketio 的命名空间


@app.route('/')
def index():
    print()
    return "aasdlkfjasldkjf"


# 注册一个 my_event事件，响应前端发来的 my_event 事件的信息
@socketio.on('my_event', namespace=name_space)
def mtest_message(data):
    print(data)
    # 发送一个 事件名称是 dcenter1 的信息给前端
    event_name = 'dcenter1'
    broadcasted_data = {"type": "delete", "user_id": "123", "data": "1111111111111"}
    socketio.emit(event_name, broadcasted_data, broadcast=False, namespace=name_space)


# 下面注册 连接/断开/消息 三个默认事件
@socketio.on('connect', namespace=name_space)
def connected_msg():
    print('client connected.')


@socketio.on('disconnect', namespace=name_space)
def disconnect_msg():
    print('client disconnected.')


@socketio.on("message", namespace=name_space)
def message(data):
    print("message")


if __name__ == '__main__':
    # app.run(host='0.0.0.0', port=5000, debug=True)
    socketio.run(app, host='127.0.0.1', port=5000, debug=True)

前端代码

引入到了一个js库，在webstome里可以直接抓下载到

    
    




Demo of SocketIO
点击发送信息


接收dcenter事件信息

结尾：

参考博客然后修修改改终于成功运行

https://blog.csdn.net/qq_38463737/article/details/126678480