How to handle Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause()

Below is my code in aspx page to allow playing audio's of wav format in the browser but with my current code I am unable to play wav audios in Chrome browser but it works in Firefox. How can I handle this exception?

<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>

For Chrome they changed autoplay policy, so you can read about here:

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.
    });
}

Try using a callback like this with the catch block.

document.getElementById("audio").play().catch(function() {
    // do something
});

I don't know if this is still actual for you, but I still leave my comment so maybe it will help somebody else. I had same issue, and the solution proposed by @dighan on bountysource.com/issues/ solved it for me.

So here is the code that solved my problem:

var media = document.getElementById("YourVideo");
const playPromise = media.play();
if (playPromise !== null){
    playPromise.catch(() => { media.play(); })
}

It still throws an error into console, but at least the video is playing :)

All new browser support video to be auto-played with being muted only so please put

<video autoplay muted="muted" loop id="myVideo"> <source src="https://w.r.glob.net/Coastline-3581.mp4" type="video/mp4"> </video>

Something like this

URL of video should match the SSL status if your site is running with https then video URL should also in https and same for HTTP

How to handle Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause()

Related

Recent Posts