为了账号安全,请及时绑定邮箱和手机立即绑定

Flask SocketIO Emit with broadcast=true 不会向发送者发送消息

Flask SocketIO Emit with broadcast=true 不会向发送者发送消息

湖上湖 2022-10-18 17:48:24
第一次在这里发海报。我正在尝试使用 Flask-SocketIO 组合一个聊天室应用程序,并且很难让一个微小但至关重要的部分工作。当我在服务器中调用 emit 方法并设置 broadcast=True 标志时,预期的行为是它会在客户端为所有用户(包括发送者)触发相应的 socket.on 事件。但是,我的代码显然只对发件人以外的所有客户端执行此操作。这与https://flask-socketio.readthedocs.io/en/latest/上的文档相反,其中指出:在启用广播选项的情况下发送消息时,连接到命名空间的所有客户端都会收到它,包括发送者。当不使用命名空间时,连接到全局命名空间的客户端会收到消息。我需要它来发送消息并为发送者以及所有其他客户端触发 socket.on 事件。谁能解释我在这里做错了什么?因为这似乎是一个基本功能,我一定错过了一些非常明显的东西。服务器代码:import osimport requestsfrom flask import Flask, jsonify, render_template, requestfrom flask_socketio import SocketIO, emit, join_room, leave_roomapp = Flask(__name__)app.config['SECRET_KEY'] = os.getenv('SECRET_KEY')socketio = SocketIO(app)channels = ['a', 'b', 'c', 'testing', 'abc', '123']ch_msgs = {'a': ['testing', '1234', 'high five'], 'b': ['hello']}msg_limit = 100@app.route('/')def index():    return render_template('index.html')@socketio.on('add channel')def add(data):    new_channel = data    channels.append(new_channel)    ch_msgs[new_channel] = list()    emit('announce channel', new_channel, broadcast=True)if __name__ == '__main__':    app.run(debug=True, host='0.0.0.0')Javascript:document.addEventListener('DOMContentLoaded', () => {    var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port);    socket.on('connect', () => {        document.querySelector('#add_channel').onclick = () => {            const new_channel = document.querySelector('#new_channel').value;            socket.emit('add channel', new_channel);        };    });    socket.on('announce channel', data => {        const li = document.createElement('li');        li.innerHTML = '#' + `${data}`;        $('#channel_list').append(li);    });});
查看完整描述

1 回答

?
白猪掌柜的

TA贡献1893条经验 获得超10个赞

实际上所有客户端都在接收发送的消息,包括发送者,但这里的问题是发送者的页面在表单提交后立即刷新,(这是表单的默认行为)从而导致所有本地数据丢失.


为了防止这种情况,您需要使用event.preventDefault()方法。在您的情况下,您可以更改事件的事件处理程序,connect如下所示:


socket.on('connect', () => {

    document.querySelector('#add_channel').onclick = event => {

        event.preventDefault();

        const textinput = document.querySelector('#new_channel')

        const new_channel = textinput.value;

        textinput.value = "";    // Clear input after value is saved

        socket.emit('add channel', new_channel);

    };

});


查看完整回答
反对 回复 2022-10-18
  • 1 回答
  • 0 关注
  • 98 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号