无法使用flask-socketio在聊天应用程序的HTML页面中显示消息答案

【问题标题】：Not able to display messages in HTML page in chat app using flask-socketio无法使用flask-socketio在聊天应用程序的HTML页面中显示消息
【发布时间】：2020-10-09 15:35:48
【问题描述】：

我正在使用flask-socketio 制作一个flask 聊天应用程序。当我单击发送按钮时，屏幕上不会显示任何消息。我已经参考了 flask-socketio 文档来设置所有内容。有人可以在这里帮助我吗。
mainapp.py sn-p

from flask_socketio import SocketIO, send, emit
app = Flask(__name__)
app.secret_key = 'replace later'

# Initialise Flask-Socketio
socketio = SocketIO(app)

@app.route("/chat", methods=['GET', 'POST'])
def chat():
    return render_template('chat.html')

@socketio.on('message')
def message(data):
    #print(f"\n{data}\n")
    send(data)

chat.html sn-p

<div id="display-message-section">
</div>
<!-- Input area -->
<div id="input-area">
    <input type="text" id="user_message" placeholder="Type here..." autocomplete="off">
    <button type="button" id="send_message">SEND</button>
</div>
<!-- SocketIO JS -->
<script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js" integrity="sha256-yr4fRk/GU1ehYJPAs8P4JlTgu0Hdsp4ZKrx8bDEDC3I="
    crossorigin="anonymous"></script>

<!-- Custom SocketIO JS -->
<script src="{{ url_for('static', filename='scripts/socketio.js') }}"></script>

socketio.js（在静态/脚本中）sn-p

document.addEventListener('DOMContentLoaded', () => {
    var socket = io.connect('http://' + document.domain + ':' + location.port);

    socket.on('connect', () => {
        socket.send("I am connected");
    });

    socket.on('message', data =>{
        const p = document.createElement('p');
        const br = document.createElement('br');
        p.innerHTML = data;
        document.querySelector('#display-message-section').append(p);
    });

    document.querySelector('#send_message').onclick = ()=>{
        socket.send(document.querySelector('#user_message').value);
    }
})

输出的样子 - Link to image 1
应该是什么样子 - Link to image 2

【问题讨论】：

请在服务器上启用 Socket.IO 日志并将它们包含在您的问题中。还要查看浏览器的网络选项卡是否有错误。

标签： python flask-socketio

【解决方案1】：

尝试清除 cookie 和缓存，现在一切正常。

【讨论】：