I can't play a sound file

Rupster · Aug 19, 2022

I am trying to play an mp3 file that's in the same location as the following .htm file, but no sound is playing:

<!DOCTYPE html>
<html>
<body>
<script>
const audioElement = new Audio('cat.mp3');
audioElement.play();
</script>
</body>
</html>

Thanks for any help.

Padonak · Aug 19, 2022

User interaction needed first

HTML:

<!DOCTYPE html>
<html>
<body>
<button>Play</button>
<script>
const audioElement = new Audio('cat.mp3');
document.querySelector('button').addEventListener('click', function(){
audioElement.play();
});
</script>
</body>
</html>

Rupster · Aug 19, 2022

Thanks.

Rupster · Sep 5, 2022

The above code works OK when I use the Windows Chrome browser on my laptop, but when I use the Android Chrome browser on my mobile phone, it doesn't make any sound.

The .mp3 file and .htm code are both in the same folder on my phone, and I have also tried using a full path to the .mp3 file.

I have made sure that Settings -> Site settings -> Sound is set to Allowed.

Thanks.

Rupster · Sep 6, 2022

Is anyone able to help with this?

MeMate · Sep 6, 2022

That code should work on every device with every browser with default settings. Your problem is somewhere else. Maybe your android settings?

Rupster · Sep 7, 2022

I can't find any other sound settings to change in Android that affect the Chrome browser.

Interestingly when I go to the Google Translate website in Chrome on my phone, when I type a word and click on the speaker icon, no sound is made. I tried this with the Edge browser too, and I get the same issue, so I'm wondering whether the problem is sound setting in the Android operating system rather than a browser setting?

MeMate · Sep 10, 2022

What you may try is this:
Set your Android to developer mode (Google for it)
Install Developer tools for your android chrome (google for it)

Run your project. You should be able to see the console of chrome. Is there any errors?

The only thing comes to my mind is a "permission denied" error.

Try this on your site for testing

Code:

<audio src="cat.mp3" type="audio/mp3" id="testaudio">
<script>

const audioElement =document.getElementById('testaudio');


document.querySelector('button').addEventListener('click', function(){
audioElement.play();
});


</script>

If that works, than it has to do with the order your page is loading your elements. For security reasons chrome and safari may block audio and video elements that aren't available within the body tag. So not available on body.onload.

But: If so, there's a work arround. Don't put your javascript into the body of your site, but in the head section and run it by the onload Event.

Rupster · Sep 12, 2022

Thanks - I will go through this when I have time and let you know how I get on.

Rupster · Sep 19, 2022

Hello. Sorry for the delay on replying.

I've been able to set my phone to developer mode, but I can't find anywhere about how to install the developer tools for Android.

How to play corresponding sound?	2	Jun 10, 2023
Fading effect between play and play-over and pause and pause-over	0	Oct 16, 2021
I am trying to make an audio player, how do I get the selected file to be playable?	5	Mar 29, 2022
I am trying to make an auto-play thing. How do I make it work?	5	Apr 5, 2022
How do i convert a Chinese DAT file from a game I play	2	Feb 4, 2022
What "might" I be doing wrong with this snippet?	6	Sep 25, 2023
I can't make my click addEventListener work	3	Dec 30, 2022
How to save JSON Data to a file using fetch() api?	2	Apr 28, 2022

I can't play a sound file

Rupster

Padonak

Rupster

Rupster

Rupster

MeMate

Rupster

MeMate

Rupster

Rupster

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads