Удаленное видео не отображается в реализации видеовызовов Django WebSockets

Я пытаюсь создать функцию видеозвонка для двух пользователей (локального и удаленного), используя Django, WebSockets, HTML и JavaScript. Локальное видео работает нормально, но удаленное видео не отображается, хотя оно существует. Я получаю следующую ошибку:

Ошибка: DOMException: Failed to execute 'setRemoteDescription' on 'RTCPeerConnection': Failed to set remote answer sdp: Called in wrong state: stable Ошибка возникает в этом фрагменте кода:

function handleAnswer(answer) { console.log('Handling answer:', answer); if (peerConnection.signalingState !== 'have-local-offer') { console.warn('Unexpected signaling state:', peerConnection.signalingState, 'Answer ignored.'); return; } peerConnection.setRemoteDescription(new RTCSessionDescription(answer)).then(() => { console.log('Remote description set for answer:', answer); }).catch(error => { console.error('Error setting remote description for answer:', error); }); }

HTML:

<div class="video-root" id="vid-area">
    <div class="username-wrapper"><span class="user-name">+11ß</span></div>
    <video class="video-player" id="consultant" autoplay playsinline></video>
    <!-- Here where the remote comes in  -->
    <div id="remoteVideoFrame" class="smallFrame" style="display : none;">
        <video class="video-player" id="client" autoplay playsinline></video>
    </div>
    <div class="controls-wrapper">
        <div class="icon-wrapper">
            <i class='bx bx-microphone control-icon' id="mic-btn"></i>
        </div>
        <div class="icon-wrapper">
            <i class='bx bx-camera-home control-icon' id="camera-btn"></i>
        </div>
        <div class="icon-wrapper">
            <i class='bx bx-screenshot control-icon' id="screen-share"></i>
        </div>
        <div class="icon-wrapper">
            <i class='bx bx-phone-off control-icon' id="leave-btn"></i>
        </div>
    </div>
</div>

JavaScript:

Python (consumers.py) :

import json
from channels.generic.websocket import AsyncWebsocketConsumer

class WebRTCConsumer(AsyncWebsocketConsumer):
    async def connect(self):
        self.room_name = self.scope['url_route']['kwargs']['room_name']
        self.room_group_name = f'webrtc_{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
        )

    async def receive(self, text_data):
        data = json.loads(text_data)
        message_type = data.get('type')

        # Log received message
        print(f'Received message: {data}')

        # Handle different message types and send them to the room group
        if message_type in ['offer', 'answer', 'candidate']:
            await self.channel_layer.group_send(
                self.room_group_name,
                {
                    'type': 'webrtc_message',
                    'message': data
                }
            )

    async def webrtc_message(self, event):
        message = event['message']

        # Log sending message
        print(f'Sending message: {message}')

        # Send message to WebSocket
        await self.send(text_data=json.dumps(message))

Краткое описание проблемы: Основная проблема заключается в том, что удаленное видео не отображается, и я получаю ошибку, связанную с состоянием сигнализации при настройке удаленного описания. Любая помощь в решении этой проблемы будет очень признательна!

Заранее спасибо!

Вернуться на верх