SocketIO: нет ответа - PullRequest
       106

SocketIO: нет ответа

0 голосов
/ 20 июня 2020

Я решаю создать чат-сайт с SocketIO, и я решил сначала попробовать SocketIO.

Я написал код ниже:

Flask

import os
import requests

from flask import Flask, jsonify, render_template, request
from flask_socketio import SocketIO, emit

app = Flask(__name__)
app.config["SECRET_KEY"] = os.getenv("SECRET_KEY")
socketio = SocketIO(app)


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


@socketio.on("send")
def vote(data):
    print("received message.")
    message = data['message']
    emit("announce message", {"message": message}, broadcast=True)

if __name__ == '__main__':
    app.run(debug=True)

HTML:

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></script>
        <script src="{{ url_for('static', filename='index.js') }}"></script>
        <link rel = "stylesheet" src="{{ url_for("static", filename = "styles.css") }}">
        <title>Messages</title>
    </head>
    <body>
        <ul id="message">
        </ul>
        <hr>
        <textarea id="textbox" placeholder="Message..."></textarea>
        <button id="vote">Send</button>
    </body>
</html>

Javascript (index. js):

document.addEventListener('DOMContentLoaded', () => {

    // Connect to websocket
    var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port);

    // When connected, configure buttons
    socket.on('connect', () => {

        // The button should emit the value of the textbox
        document.getElementById('send').onclick = () => {
                const message = document.getElementById('textbox').value;
                socket.emit('send', {'message': message});
            };
        });

    // When a new vote is announced, add to the unordered list
    socket.on('announce message', data => {
        const li = document.createElement('li');
        li.innerHTML = `Message: ${data.message}`;
        document.getElementById('message').append(li);
    });
});

Приложение должно добавлять сообщение, указанное в текстовом поле, когда я нажимаю кнопку, но при этом ничего не происходит. Функция печати «полученное сообщение» не распечатала. Нет сообщений об ошибках в консоли python или js. Единственное, что там написано:

XHR finished loading: GET "<URL>".
socket.io.min.js:1 XHR finished loading: GET "http://127.0.0.1:5000/socket.io/?EIO=3&transport=polling&t=1592617159769-5&sid=367fef078db34477ba68465900a058b7".
i.create @ socket.io.min.js:1
i @ socket.io.min.js:1
o.request @ socket.io.min.js:1
o.doPoll @ socket.io.min.js:1
n.poll @ socket.io.min.js:2
n.onData @ socket.io.min.js:2
(anonymous) @ socket.io.min.js:1
n.emit @ socket.io.min.js:1
i.onData @ socket.io.min.js:1
i.onLoad @ socket.io.min.js:1
hasXDR.e.onreadystatechange @ socket.io.min.js:1

Кто-нибудь может мне помочь?

...