Не могу установить соединение между веб -сокетом и сервером ⇐ Javascript

[Anonymous]

Я пишу приложение чата, используя каналы Django, Redis и Daphne. Когда я пытаюсь отправить сообщение и нажимать на кнопку, у меня есть запрос, но я написал JS в своем файле HTML, и она должна предотвратить поведение этой формы. Я не знаю, почему это не устанавливает связь и просто отправляет запрос получить, что здесь не так? Я проверил Redis Server, он работает. Я установил все необходимые модули, я проверил их с помощью GPT, ничего не помогает. Как заставить его установить соединение?import json

from channels.generic.websocket import AsyncWebsocketConsumer
from channels.db import database_sync_to_async

from django.apps import apps

class ChatConsumer(AsyncWebsocketConsumer):
async def connect(self):
self.chat_name = self.scope['url_route']['kwargs']['chat_name']
await self.channel_layer.group_add(self.chat_name, self.channel_name)

await self.accept()

@database_sync_to_async
def save_message(self, text_data):
Chat = apps.get_model('chat', 'Chat')
ChatMessage = apps.get_model('chat', 'ChatMessage')
User = apps.get_model('auth', 'User')

chat = Chat.objects.get(chat_name=text_data['chat_name'])
sender = User.objects.get(username=text_data['sender'])
ChatMessage.objects.create(
chat=chat,
body=text_data['message'],
sender = sender,
)

async def receive(self, text_data):
print('Received from frontend:', text_data)
data_json = json.loads(text_data)
await self.save_message(data_json)

event = {"type": "send_chat_message", "message": data_json}

await self.channel_layer.group_send(self.chat_name, event)

async def send_chat_message(self, event):
await self.send(text_data=json.dumps({"message": event["message"]}))

chat.html:
{% extends "base.html" %}





Chat


{% block content %}

Chat with {{ chat.members.all.0 }}


{% for message in chat_messages %}
{{ message.sender.username }}: {{ message.body }}
{% empty %}
There are no meassages yet...
{% endfor %}




Send



{% endblock %}


const chat_name = "{{ chat.chat_name }}"
const socket = new WebSocket(`ws://127.0.0.1:8000/ws/chat/${chat_name}/`) // creatimg ws connection

// sending the message to the socket
const message_form = document.getElementById("message-form")
message_form.addEventListener( // Listener for submit button
"submit", function (event) {
event.preventDefault()
let sent_message = document.getElementById("message-input").value // get the value of the input of the form
socket.send(
JSON.stringify({
message: sent_message,
chat_name: "{{ chat.chat_name }}",
sender: "{{ request.user.username }}"

})
)
}
)

//Getting the message
const chats_div = document.getElementById("message-container") // search for container where we will paste the message
function scrollToBottom() {
chats_div.scrollTop = chats_div.scrollHeight
} //???

//Processing of the message from the server
socket.addEventListener("message", function(e) {
const data = JSON.parse(e.data);

let sender = data.message.sender
let content = data.message.message

let msg_body = document.createElement("div")
let msg_sender = document.createElement("div")

msg_body.textContent = content
msg_sender.textContent = sender

let chats_div = document.getElementById("message-container")
let msg = document.createElement("p")
msg.innerHTML = `${msg_sender.textContent}: ${msg_body.textContent}`;

chats_div.appendChild(msg);
scrollToBottom()
})





Aasgi.py:
import os
import django

from django.core.asgi import get_asgi_application
from channels.routing import ProtocolTypeRouter, URLRouter
from channels.auth import AuthMiddlewareStack

from chat.routing import websocket_urlpatterns

os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'messanger.settings')
django.setup()

application = ProtocolTypeRouter({
"http": get_asgi_application(), # Обычные HTTP-запросы
"websocket": AuthMiddlewareStack(URLRouter(websocket_urlpatterns)),
})

routings.py:
from django.urls import re_path

from .consumers import ChatConsumer

websocket_urlpatterns = [
re_path(r"ws/chat/(?P\w+)/$", ChatConsumer.as_asgi()),
]

views.py
from django.shortcuts import render

from .models import *

def chat_list(req):
chats = req.user.chats.all()
print(chats)
return render(req, 'chat_list.html', {'chats': chats})

def chat(req, chat_name):
chat = req.user.chats.get(chat_name=chat_name)
chat_messages = ChatMessage.objects.filter(chat=chat)
return render(req, 'chat.html', {'chat_messages': chat_messages, 'chat': chat})

models.py:
from django.db import models
from django.contrib.auth.models import User

class Chat(models.Model):
chat_name = models.CharField(max_length=50)
members = models.ManyToManyField(User, related_name='chats')
created = models.DateTimeField(auto_now_add=True)

def __str__(self):
return self.chat_name

class ChatMessage(models.Model):
body = models.TextField()
chat = models.ForeignKey(Chat, on_delete=models.CASCADE, related_name='chat')
sender = models.ForeignKey(User, on_delete=models.CASCADE)
created = models.DateTimeField(auto_now_add=True)

def __str__(self):
return f"Message by @{self.sender} from the chat '{self.chat.chat_name}'"


Подробнее здесь: https://stackoverflow.com/questions/795 ... and-server