I’m trying to make web page in which there will be music playing in background.
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Website </title>
</head>
<body>
<h2>Welcome to my website</h2>
<audio src="sound.mp3" controls autoplay>
<p>If you are reading this, it is because your browser does not support the audio element. </p>
</audio>
</body>
</html>
You can see audio player, so web page can find mp3 file for sure.(https://i.stack.imgur.com/4GERM.png)
I tried many different approaches (audio tag, embed tag, iframe, some js scripts) but I can only make audio player and I have to turn on music manually, and I can’t find way to start playing music, when i enter web page. My browser is opera gx, but i tried also do this in edge with same results. Do you have any ideas how to make it work?
2
Answers
Many browsers block web pages from auto-playing audio
This is because many people (including me!) are annoyed when web pages play sounds without their permission, since they may be in a quiet area, where it is disruptive to others.
Chrome is a good example
Google explained this in this blog post:
https://developer.chrome.com/blog/autoplay/
More information on the Chromium project website:
https://sites.google.com/a/chromium.org/dev/audio-video/autoplay
Try different browsers
You might find a browser that is less thoughtful. This might be acceptable to you, if it is just for your own use, or your end-users are happy to have auto-playing sound and therefore to use a particular browser for your page.
This is because Chromium-based browsers disallow autoplay
There are plenty of possible approaches discussed here, or you can simply Google for
"autoplay audio in chromium browsers"to find more.