This commit is contained in:
Халимов Рустам
2026-03-11 16:57:13 +03:00
parent 4f4813c403
commit 41dd1c7641
+28 -36
View File
@@ -262,55 +262,47 @@ export default function CallModal({ isOpen, onClose, targetUser, callType: initi
}; };
// Force binding to the SINGLE stable video element // Force binding to the SINGLE stable video element
// Use a custom property on the video element to track the play promise
if (remoteVideoRef.current) { if (remoteVideoRef.current) {
if (remoteVideoRef.current.srcObject !== stream) { const video = remoteVideoRef.current as any;
const startPlayback = async () => {
// If a play promise is already pending, don't start a new one
if (video._playPromise) {
console.log('[WebRTC] Play promise already pending, skipping...');
return;
}
try {
if (video.srcObject !== stream) {
console.log('[WebRTC] Binding stream to video element'); console.log('[WebRTC] Binding stream to video element');
remoteVideoRef.current.srcObject = stream; video.srcObject = stream;
// Force load to ensure browser picks up streams properly
remoteVideoRef.current.load();
}
// Try to play. If fails, it's usually autoplay policy
remoteVideoRef.current.play().catch(() => {
console.warn('[WebRTC] Autoplay blocked, waiting for interaction');
const retryPlay = () => {
if (!remoteVideoRef.current) return;
remoteVideoRef.current.play().then(() => {
console.log('[WebRTC] Video started after retry');
}).catch(() => {
// If blocked, ensure it's muted and try again
if (remoteVideoRef.current) remoteVideoRef.current.muted = true;
setTimeout(retryPlay, 2000);
});
};
retryPlay();
});
} }
video.muted = false;
// Handle remote media via the remoteVideoRef console.log('[WebRTC] Initiating play()...');
if (remoteVideoRef.current) { video._playPromise = video.play();
if (remoteVideoRef.current.srcObject !== stream) {
console.log('[WebRTC] Binding stream to video element');
remoteVideoRef.current.srcObject = stream;
}
// Ensure not muted for remote audio await video._playPromise;
if (remoteVideoRef.current.muted) {
remoteVideoRef.current.muted = false;
}
remoteVideoRef.current.play()
.then(() => {
console.log('[WebRTC] Playback started successfully'); console.log('[WebRTC] Playback started successfully');
video._playPromise = null;
setNeedsInteraction(false); setNeedsInteraction(false);
}) } catch (e: any) {
.catch(e => { video._playPromise = null;
if (e.name === 'NotAllowedError' || e.name === 'NotSupportedError') { if (e.name === 'NotAllowedError' || e.name === 'NotSupportedError') {
console.warn('[WebRTC] Autoplay blocked, waiting for interaction'); console.warn('[WebRTC] Autoplay blocked, waiting for interaction');
setNeedsInteraction(true); setNeedsInteraction(true);
} else if (e.name === 'AbortError') {
console.warn('[WebRTC] Playback interrupted (AbortError), safe to ignore');
} else { } else {
console.warn('[WebRTC] Playback failed (non-autoplay error):', e); console.error('[WebRTC] Playback failed:', e);
} }
}); }
};
startPlayback();
} }
track.onunmute = checkVideo; track.onunmute = checkVideo;