如何使用 JSON 通过 websockets 发送 Django 数据？

Question

我正在开发一个通过 websockets 发送数据的 django 应用程序

我将数据放入 java object 转换为 JSON 然后在另一端解析

我的代码是

chatSocket.onmessage = function(e) {
    console.log(e)
    const data = JSON.parse(e.data);
};

document.querySelector('#chat-message-submit').onclick = function(e) {
    const messageInputDom = document.querySelector('#chat-message-input');
    const message = messageInputDom.value;
    var messageObject = {
        'username': username,
        'message': message,
        'test': 'abc',
        }
    console.log(messageObject)
    chatSocket.send(JSON.stringify(messageObject));
};

messageObject 似乎格式正确

{username: "jeff", message: "qwerty", test: "abc"}

但是onmessage function 中的 output 只显示

MessageEvent {isTrusted: true, data: "{"message": "qwerty"}", origin: "ws://192.168.1.138:8000", lastEventId: "", source: null, …}

我的其他数据去哪儿了？

Answer 1

这里的问题似乎是我使用的 django 代码要求数据在名为message的变量中传输。 这是一个典型的……小知识……

我熟悉 Python，但对 javascript 很陌生。 因此，当我遇到问题时，我认为问题出在我的 javascript 中，并没有进一步查找。

消费者.py

...
# Receive message from WebSocket
async def receive(self, text_data):
    text_data_json = json.loads(text_data)
    message = text_data_json['message']
...
# Receive message from room group
async def chat_message(self, event):
    message = event['message']
...

下面的代码解决了这个问题：

chatSocket.onmessage = function(e) {
    const data = JSON.parse(e.data);
    messageObject = data.message
    username = messageObject.username
    text = messageObject.text
};

document.querySelector('#chat-message-submit').onclick = function(e) {
    const messageInputDom = document.querySelector('#chat-message-input');
    const text = messageInputDom.value;
    var messageObject = {
        'message': {'username': username, 'text': text, 'test': 'abc'},
        }
    chatSocket.send(JSON.stringify(messageObject));
};