Javascript和Django频道：窗口clos上的聊天应用程序注销通知

Question

我正在用Javascript和Django频道编写一个聊天应用程序。我正在尝试获取一条“用户已离开聊天室”的消息，以便在窗口关闭时发送，也可以在websocket关闭时发送。我不确定websocket是否关闭得太快，但我目前的代码无法正常工作。我可能应该在chat consumer的disconnect函数中定义。我不确定这些东西的处理顺序。你知道吗

Javascript语言

// Declare variables
    var userName;
    var currentZone = new Date().toTimeString().slice(17);
    // var roomName = {{ room_name_json }};
    document.getElementById("chatname").innerHTML = roomName;

// Create Websocket
    var chatSocket = new ReconnectingWebSocket(
        'ws://' + window.location.host +
        '/ws/chat/' + roomName + '/');

// Send message
    chatSocket.onmessage = function(e) {
        var data = JSON.parse(e.data);
        var message = data['message'];
        document.querySelector('#chat-log').value += (message + '\n');
        document.getElementById("chat-log").scrollTop = document.getElementById("chat-log").scrollHeight;
    };

// Set User
    window.onload = function(){
        userName = sessionStorage.getItem("user");
        if (userName==null || userName===false) {
            userName = prompt("Please enter a username:");
        };
        return userName;
    }

//Join message
    function chatJoin() {
        if(chatSocket.readyState == false) {
           window.setTimeout(chatJoin, 500); /* Wait 500 milliseconds*/
        } else {
            var message = userName + " has joined the chat."
            chatSocket.send(JSON.stringify({
                'message': message
            }));
        }
    }
    chatJoin();

    // chatSocket.onclose = function(e) {
    //     console.error('Chat socket closed unexpectedly');
    // };

// Sign off message
    window.unload = function(e) {
        var message = userName +"has left the chat."
        chatSocket.send(JSON.stringify({
            'message': message
        }));
    };

    document.querySelector('#chat-message-input').focus();
    document.querySelector('#chat-message-input').onkeyup = function(e) {
        if (e.keyCode === 13) {  // enter, return
            document.querySelector('#chat-message-submit').click();
        }
    };

    document.querySelector('#chat-message-submit').onclick = function(e) {
        var currentDate = new Date();
        var currentTime = currentDate.toLocaleTimeString();
        var messageInputDom = document.querySelector('#chat-message-input');
        var message = userName + " " + currentTime + currentZone + ': ' + messageInputDom.value;
        chatSocket.send(JSON.stringify({
            'message': message
        }));

        messageInputDom.value = '';
    };

消费者

from channels.generic.websocket import AsyncWebsocketConsumer
from channels.generic.websocket import WebsocketConsumer

import json

class ChatConsumer(AsyncWebsocketConsumer):
    async def connect(self):
        self.room_name = self.scope['url_route']['kwargs']['room_name']
        self.room_group_name = 'chat_%s' % self.room_name

        # Join room group
        await self.channel_layer.group_add(
            self.room_group_name,
            self.channel_name
        )

        await self.accept()

    async def disconnect(self, close_code):
        # Leave room group
        await self.channel_layer.group_discard(
            self.room_group_name,
            self.channel_name
        )

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

        # Send message to room group
        await self.channel_layer.group_send(
            self.room_group_name,
            {
                'type': 'chat_message',
                'message': message
            }
        )

    # Receive message from room group
    async def chat_message(self, event):
        message = event['message']

        # Send message to WebSocket
        await self.send(text_data=json.dumps({
            'message': message
        }))

我也尝试过这样的断开连接功能，我希望在消息中包含用户名，以便它需要接收一些数据：

    async def disconnect(self, text_data, close_code):
        text_data_json = json.loads(text_data)
        message = text_data_json['message']

        # Send message to room group
        await self.channel_layer.group_send(
            self.room_group_name,
            {
                'type': 'chat_message',
                'message': message
            }
        )

        # Leave room group
        await self.channel_layer.group_discard(
            self.room_group_name,
            self.channel_name
        )

Answer 1

与其从断开连接的客户端发送“user has disconnected”消息，不如让服务器来做。你知道吗

因此，在disconnect上，在丢弃组之前，发送XXX has left the chat.消息。你知道吗