미수습자 처리 방법(약속) DOM 예외:일시 중지() 호출로 인해 재생() 요청이 중단되었습니다.
아래는 브라우저에서 wav 형식의 오디오를 재생할 수 있는 aspx 페이지의 코드이지만 현재 코드로는 크롬 브라우저에서 wavaudio를 재생할 수 없지만 Firefox에서 작동합니다.이 예외를 처리하려면 어떻게 해야 합니까?
<script>
window.onload = function () { document.getElementById("audio").play(); }
window.addEventListener("load", function () { document.getElementById("audio").play(); });
</script>
<body>
<audio id='audio' controls autoplay>
<source src="Sounds/DPM317.wav" type="audio/wav" />
Your browser does not support the audio element.
</audio>
</body>
Chrome의 경우 자동 재생 정책이 변경되어 다음을 참조할 수 있습니다.
var promise = document.querySelector('audio').play();
if (promise !== undefined) {
promise.then(_ => {
// Autoplay started!
}).catch(error => {
// Autoplay was prevented.
// Show a "Play" button so that user can start playback.
});
}
캐치 블록과 함께 이런 콜백을 사용해 보십시오.
document.getElementById("audio").play().catch(function() {
// do something
});
이것이 당신에게 여전히 실제인지는 모르겠지만, 저는 여전히 제 의견을 남깁니다. 그래서 아마 다른 사람에게 도움이 될 것입니다.저도 같은 문제가 있었는데, bountysource.com/issues/ 에서 @dighan이 제안한 해결책으로 해결되었습니다.
여기 제 문제를 해결한 코드가 있습니다.
var media = document.getElementById("YourVideo");
const playPromise = media.play();
if (playPromise !== null){
playPromise.catch(() => { media.play(); })
}
여전히 콘솔에 오류가 발생하지만 적어도 비디오는 재생 중입니다 :)
- 모든 새 브라우저 지원 비디오는 음소거로만 자동 재생되므로 입력하십시오.
<video autoplay muted="muted" loop id="myVideo"> <source src="https://w.r.glob.net/Coastline-3581.mp4" type="video/mp4"> </video>
이런 거.
- 사이트가 https로 실행 중인 경우 비디오 URL이 SSL 상태와 일치해야 하며 HTTP의 경우 비디오 URL도 https와 동일해야 합니다.
추가muted="muted"HTML5 태그에 대한 속성은 내 문제를 해결했습니다.
저는 크롬 버전 75를 사용하고 있습니다.
비디오 태그에 음소거 속성 추가
<video id="myvid" muted>
그런 다음 Javascript를 사용하여 재생하고 음소거를 false로 설정합니다.
var myvideo = document.getElementById("myvid");
myvideo.play();
myvideo.muted = false;
편집: 사용자 상호 작용이 필요합니다(작업하려면 페이지의 아무 곳이나 클릭).
두 번째 쇼빗 베르마는 덧붙일 말이 있습니다. 그의 게시물에서 그는 자동 재생이 성공하기 위해서는 플레이어가 음소거되어야 한다고 말했습니다.아이러니하게도, 로드 후 볼륨을 높여도 계속 재생됩니다.눈에 보이지 않는 프레임을 무시하는 안티-팝업 정비사들이 당신 코드에 미끄러져 들어가는 것과 같습니다.php-muted html 및 javascript는 : 10초 setTimeout 볼륨이 최대로 상승하는 본문 태그 로드, 자동 재생 및 muted='muted' 비디오(예, $muted_code 부분은 = "muted='muted"입니다.
echo "<body style='margin-bottom:0pt; margin-top:0pt; margin-left:0pt; margin-right:0pt' onLoad=\"setTimeout(function() {var vid = document.getElementById('hourglass_video'); vid.volume = 1.0;},10000);\">";
echo "<div id='hourglass_container' width='100%' height='100%' align='center' style='text-align:right; vertical-align:bottom'>";
echo "<video autoplay {$muted_code}title=\"!!! Pausing this video will immediately end your turn!!!\" oncontextmenu=\"dont_stop_hourglass(event);\" onPause=\"{$action}\" id='hourglass_video' frameborder='0' style='width:95%; margin-top:28%'>";
제 경우에는 사용자 상호 작용을 기다려야 했기 때문에click또는touchend듣는 사람
const isMobile = navigator.maxTouchPoints || "ontouchstart" in document.documentElement;
function play(){
audioEl.play()
}
document.body.addEventListener(isMobile ? "touchend" : "click", play, { once: true });
언급URL : https://stackoverflow.com/questions/40276718/how-to-handle-uncaught-in-promise-domexception-the-play-request-was-interru
'source' 카테고리의 다른 글
| 기본 이미지가 업데이트된 경우 도커 컨테이너를 자동으로 업데이트하는 방법 (0) | 2023.08.05 |
|---|---|
| 텍스트 보기의 텍스트 색상을 프로그래밍 방식으로 설정하는 방법 (0) | 2023.08.05 |
| 제이드: 문단 내부 링크 (0) | 2023.08.05 |
| 빌드: '노드'에 대한 형식 정의 파일을 찾을 수 없습니다. (0) | 2023.08.05 |
| CSS ":hover"를 활성화하는 순수 자바스크립트에서 마우스 오버를 시뮬레이션하려면 어떻게 해야 합니까? (0) | 2023.08.05 |