자바스크립트에서 오디오 자동재생시 powerMonitoring.js:2198 Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. https://goo.gl/xX8pDD 에러

 

에러

특정치 이상 올라가면 경보음 켜게하려고 

// 경보음 소리파일 설정
let sirenSound = new Audio('../../../sound/sirensound.mp3'); // 노래 파일의 경로를 지정해야 합니다.
function playSiren() {
   sirenSound.play(); 
}
function pauseSiren() {
    sirenSound.pause();
}
function siren(data){
   if(data[0]>=data[1]){
       playSiren()
   }else if(data[0]>=data[2]){
       pauseSiren()
   }
}

단순하게하면 될줄알았지만

무슨 크롬 정책때문에 

powerMonitoring.js:2198 Uncaught (in promise) DOMException: play() failed 
because the user didn't interact with the document first. https://goo.gl/xX8pDD

이런 에러가발생하면서 재생이안됨

 

 

해결

구글링 결과 

1. promise를 사용할것

2. mute 시키고 재생시킨다음 mute해제할것

3. load 할것 (확실치않음)

// 경보음 소리파일 설정
let sirenSound = new Audio('../../../sound/sirensound.mp3'); 
function playSiren() {
    sirenSound.load();
    sirenSound.muted = true;
    let promise = sirenSound.play();
    if(promise !== undefined){
        promise.then(_=>{
            sirenSound.muted = false;}
            ).catch(error=>{})
    }
    
}
function pauseSiren() {
    sirenSound.pause();
}