HTML iframe allow autoplay of audio file not working safari - html

Question

This works perfect with other browsers but safari automatically downloads file.
<iframe src="lib/audio/voice.mp3" allow="autoplay" class="audio-main" id="iframeAudio">
</iframe>
I need play background audio in a website. Opera and Chrome are working fine unfortunatelly Safari Browser open website automatically audio download.What exactly is the problem, Thanks for advance

Answer 1

No Auto-Play by default says the man
According to Safari / WebKit Auto-Play policy it gives users the ability to browse the web with fewer distractions, particularly in the form of relief from websites that auto-play with sound. They instruct websites to assume that any use of video or audio will require a user gesture or click to play.
Policy configuration
Users can enable auto play functionality on a per website bases.
Safari >> Preferences >> Websites >> Auto-Play
Options are:
Allow All Auto-Play
Stop Media with Sound (default)
Never Auto-Play
Functionality iframe allow autoplay works in Safari
When the user has allowed auto play from a specific website the iframe tag works as expected.
<iframe allow="autoplay" src="happy.mp3"></iframe>
Not surprising though so too does the <audio> element load and play on its own.
<audio autoplay loop src="happy.mp3"></audio>
Detect auto play is disabled and display player
However it should be expected that this functionality will not be enabled, since the ability exists for users to disable it, so it’s important to detect if auto play was denied and proactively react accordingly.
var promise = $('video')[0].play();
if (promise) promise.catch(error => {
// Auto-play disabled show controls
$('audio').attr('controls', '');
});
For this option we do not need auto play at all since we are manually calling play. This will not work of course if a user action is required so all we are left to do is to add the controls and display the player.
Audio with controls
For the sake of completion, there's always the other option; avoid auto play all together... but what's the fun in that.
<audio controls src="happy.mp3"></audio>
nJoy!