HTML iframe允许自动播放音频文件不工作的safari

问题描述 投票:-1回答:1

这适用于其他浏览器,但Safari会自动下载文件。

<iframe src="lib/audio/voice.mp3" allow="autoplay" class="audio-main" id="iframeAudio">
</iframe>   

我需要在网站上播放背景音频。 Opera和Chrome工作正常不幸Safari浏览器自动打开网站音频下载。究竟是什么问题,谢谢你提前

html5 browser safari
1个回答
1
投票

No Auto-Play by default says the man

根据Safari / WebKit Auto-Play policy,它使用户能够以更少的干扰来浏览网页,特别是以自动播放声音的网站减轻形式。他们指示网站假设任何视频或音频的使用都需要用户手势或点击播放。

Policy configuration

用户可以在每个网站的基础上启用自动播放功能。

Safari >>偏好设置>>网站>>自动播放

选项包括:

  • 允许所有自动播放
  • 使用声音停止媒体(默认)
  • 从不自动播放

Functionality iframe allow autoplay works in Safari

当用户允许从特定网站自动播放时,iframe标签按预期工作。

<iframe allow="autoplay" src="happy.mp3"></iframe>

虽然<audio>元素也可以自行加载和播放,但这并不奇怪。

<audio autoplay loop src="happy.mp3"></audio>

Detect auto play is disabled and display player

但是应该预期不会启用此功能,因为用户可以禁用此功能,因此检测自动播放是否被拒绝并主动做出相应反应非常重要。

var promise = $('video')[0].play();

if (promise) promise.catch(error => {
    // Auto-play disabled show controls 
    $('audio').attr('controls', '');
});

对于此选项,我们根本不需要自动播放,因为我们手动调用播放。当然,如果需要用户操作,这将无效,因此我们要做的就是添加控件并显示播放器。

Audio with controls

为了完成,总有另一种选择;避免自动一起播放......但那有什么好玩的。

<audio controls src="happy.mp3"></audio>

的nJoy!

© www.soinside.com 2019 - 2024. All rights reserved.