如何删除 django-channels -socket 中的对象？

Question

我正在使用 Django 频道制作一个实时聊天应用程序。 我想使用 Django 通道从数据库中删除一个对象。怎么会这样？ 我尝试使用 AJAX 删除一些对象，但没有成功。

consumers.py

：

import json

from django.contrib.auth.models import User
from channels.generic.websocket import AsyncWebsocketConsumer
from asgiref.sync import sync_to_async

from .models import Room, Message

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

        await self.channel_layer.group_add(
            self.room_group_name,
            self.channel_name
        )

        await self.accept()

    async def disconnect(self):
        await self.channel_layer.group_discard(
            self.room_group_name,
            self.channel_name
        )

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

        await self.save_message(username, room, message)

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

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

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

    @sync_to_async
    def save_message(self, username, room, message):
        user = User.objects.get(username=username)
        room = Room.objects.get(slug=room)

        Message.objects.create(user=user, room=room, content=message)

room.html

：

{% extends 'core/base.html' %}

{% block title %}{{ room.name }} | {% endblock %}

{% block content %}
<div class="p-10 lg:p-20 text-center">
    <h1 class="text-3xl lg:text-6xl text-white">{{ room.name }}</h1>
</div>

<button onclick="lok()" type="button" class="like-button liked" id="lok"> salam
  </button>
  
  <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
  <script type="text/javascript">
    function lok() {
      $.ajax({
        type:'GET',
        url:'/chat/uta/like/',
      });
    }
  </script>
<div class="lg:w-2/4 mx-4 lg:mx-auto p-4 bg-white rounded-xl">
    <div class="chat-messages space-y-3" id="chat-messages">
        <!--from views.py :-->
       {% for m in messages %}<b>{{ m.user.username }}</b>: {{ m.content }}<br>{% endfor %}
    </div>
</div>

<div class="lg:w-2/4 mt-6 mx-4 lg:mx-auto p-4 bg-white rounded-xl">
    <form method="post" action="." class="flex">
        <input type="text" name="content" class="flex-1 mr-3" placeholder="Your message..." id="chat-message-input">

        <button 
            class="px-5 py-3 rounded-xl text-white bg-teal-600 hover:bg-teal-700"
            id="chat-message-submit"
        >Submit</button>
    </form>
</div>
{% endblock %}

{% block scripts %}
{{ room.slug|json_script:"json-roomname" }}
{{ request.user.username|json_script:"json-username" }}

<script>
    const roomName = JSON.parse(document.getElementById('json-roomname').textContent);
    const userName = JSON.parse(document.getElementById('json-username').textContent);
    const chatSocket = new WebSocket(
        'ws://'
        + window.location.host
        + '/ws/'
        + roomName
        + '/'
    );

    chatSocket.onclose = function(e) {
        console.log('onclose')
    }

    chatSocket.onmessage = function(e) {
        const data = JSON.parse(e.data);
        //from consumer.py:
        if (data.message) {
            document.querySelector('#chat-messages').innerHTML += ('<b>' + data.username + '</b>: ' + data.message + '<br>');
        }

        scrollToBottom();
    };

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

    document.querySelector('#chat-message-submit').onclick = function(e) {
        e.preventDefault()

        const messageInputDom = document.querySelector('#chat-message-input');
        const message = messageInputDom.value;

        console.log({
            'message': message,
            'username': userName,
            'room': roomName
        })
        if (message) {
        chatSocket.send(JSON.stringify({
            'message': message,
            'username': userName,
            'room': roomName
        }));
    }

        messageInputDom.value = '';

        return false
    };

    /**
    * A function for finding the messages element, and scroll to the bottom of it.
    */
    function scrollToBottom() {
        let objDiv = document.getElementById("chat-messages");
        objDiv.scrollTop = objDiv.scrollHeight;
    }

    // Add this below the function to trigger the scroll on load.
    scrollToBottom();
</script>
{% endblock %}

我应该使用 JavaScript 吗？

我尝试使用 AJAX 删除一些对象，但没有成功。

Answer 1

添加到您的字典消息附加数据：

{
     "action": "create"/"update"/"delete",
     "message": {"id": <>, ...},
     ...
}

并根据

"action"

字段内

def receive()

的值采取适当的行动