fix fullscreen autoplay bugs.

This commit is contained in:
hailin 2024-06-05 14:54:06 +08:00
parent 9609fa03e6
commit 4b9e9bb749
1 changed files with 29 additions and 22 deletions

View File

@ -29,31 +29,23 @@ var apply_url_change = function(url) {
show_for_ok(); show_for_ok();
flvPlayer = mpegts.createPlayer({type: 'flv', url: url, isLive: true, enableStashBuffer: false}); enterFullScreen(videoElement).then(() => {
flvPlayer.attachMediaElement(videoElement); flvPlayer = mpegts.createPlayer({type: 'flv', url: url, isLive: true, enableStashBuffer: false});
flvPlayer.load(); flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
videoElement.muted = true; videoElement.muted = true;
videoElement.onloadedmetadata = function() { flvPlayer.play().then(() => {
videoElement.style.width = `${videoElement.videoWidth}px`; console.log('Autoplay started');
videoElement.style.height = `${videoElement.videoHeight}px`;
enterFullScreen(videoElement).then(() => {
flvPlayer.play().then(() => {
console.log('Autoplay started');
}).catch(error => {
console.error('Autoplay was prevented:', error);
});
}).catch(error => { }).catch(error => {
console.error('Fullscreen was prevented:', error); console.error('Autoplay was prevented initially:', error);
flvPlayer.play().then(() => { retryPlay();
console.log('Autoplay started');
}).catch(error => {
console.error('Autoplay was prevented:', error);
});
}); });
}; }).catch(error => {
console.error('Fullscreen was prevented:', error);
hide_for_error();
});
}; };
var closeOverlay = function() { var closeOverlay = function() {
@ -90,6 +82,21 @@ var exitFullScreen = function() {
} }
}; };
var retryPlay = function(attempts = 3) {
if (attempts > 0) {
setTimeout(() => {
flvPlayer.play().then(() => {
console.log('Autoplay started after retry');
}).catch(error => {
console.error(`Autoplay retry failed (${3 - attempts + 1}):`, error);
retryPlay(attempts - 1);
});
}, 1000);
} else {
console.error('Autoplay failed after multiple attempts');
}
};
videoElement.addEventListener('webkitfullscreenchange', onFullScreenChange); videoElement.addEventListener('webkitfullscreenchange', onFullScreenChange);
videoElement.addEventListener('mozfullscreenchange', onFullScreenChange); videoElement.addEventListener('mozfullscreenchange', onFullScreenChange);
videoElement.addEventListener('fullscreenchange', onFullScreenChange); videoElement.addEventListener('fullscreenchange', onFullScreenChange);