При получении сообщения из сокета Flask появляется сообщение «Недопустимая левая сторона в назначении» - PullRequest
Новая
       8

При получении сообщения из сокета Flask появляется сообщение «Недопустимая левая сторона в назначении»

0 голосов
/ 10 сентября 2018

Я пытаюсь создать канал, к которому я могу присоединиться, используя сокет Flask и Javascript.

Все мои операторы отладки запускаются, показывая, что все инициализируется, но когда я пытаюсь перехватить сообщение, отправленное из моего маршрута Flask / socket-io, который, как я предполагаю, выполняет фактическое изменение комнаты, я получаю Uncaught ReferenceError: Invalid left-hand side in assignment в моя консоль ссылается на строку в моем файле JS let message = data.msg; в разделе: 

    socket.on('status', data => {
        let message = data.msg;
        document.querySelectorAll('#messages') += message;
    });

Я пытался написать data.msg различными способами (например, с помощью обратных кавычек, таких как $ {data.msg}, окруженных обратными кавычками, как будто часть отформатированной строки и т. Д.), Но ничего не получалось. Я прочитал документы, и они были скудны на деталях. Похоже, что в Интернете нет примеров того, как сделать это эффективно. Большинство людей, кажется, предпочитают node.js, но я парень из Flask.

Как я могу присоединиться к своей комнате и общаться только в этой комнате? Мне нужно разрешить пользователям создавать столько, сколько они хотят.

Вот маршрут во фляге: 

@socketio.on('join')
def on_join(data):
    username = data['username']
    room = data['room']
    join_room(room)
    emit("status", {'msg': username + 'has joined the room'}, room=room)

Вот сопровождающий JS: 

var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port);
if (!socket) console.log("Socket not connected!");

socket.on('connect', () => {
    console.log("socket connected");
    // after socket connect, configure channel button
    document.querySelectorAll('button').forEach(button => {
        button.onclick = () => {
            console.log("button click fired!");
            let username = localStorage["login"]
            let room = button.dataset.room;
            console.log("ChannelName" + room);
            socket.emit("join", {'username':username, "room":room});
        };
    });

    socket.on('status', data => {
        console.log("JOINED!")
        let message = data.msg;
        document.querySelectorAll('#messages') += message;
    });

Обратите внимание, что ошибка возникает прямо до присвоения #message div.

EDIT Распаковка ошибки обнаруживает многочисленные ссылки на минимизированный JS-файл, указанный в socket-io. Он находится в <head> разделе layout.html. Размещение в <body> вызвало серьезные ошибки, затруднившие разработку всей функциональности, связанной с сокетами. 

messages:134 Uncaught ReferenceError: Invalid left-hand side in assignment
    at r.socket.on.data (messages:134)
    at r.n.emit (socket.io.min.js:1)
    at r.onevent (socket.io.min.js:1)
    at r.onpacket (socket.io.min.js:1)
    at n.<anonymous> (socket.io.min.js:1)
    at n.emit (socket.io.min.js:1)
    at n.ondecoded (socket.io.min.js:1)
    at s.<anonymous> (socket.io.min.js:1)
    at s.n.emit (socket.io.min.js:1)
    at s.add (socket.io.min.js:2)

1 Ответ

0 голосов
/ 10 сентября 2018

Это недопустимо: document.querySelectorAll('#messages') += message;

document.querySelectorAll('#messages') Даст вам список элементов DOM.

Кроме того, идентификаторы элементов должны быть уникальными, так что вы, вероятно, должны бытьиспользуя document.querySelector('#messages'), поэтому извлекайте только один элемент, а не список.

Вы не можете добавлять / объединять текст непосредственно в элемент таким образом.Вы, вероятно, ищете что-то вроде document.querySelector('#messages').innerHTML += message;

...