音频标签自动播放不适用于移动设备

Question

我正在使用这段代码，当我看到 controls 时，我发现自动播放功能无法正常工作。

<audio autoplay="true" src="music/lathe_di_chadar.mp3" type="audio/mp3" loop></audio>

它不适用于移动设备，但在网站上运行良好。任何人都可以告诉我这个问题吗？

谢谢，非常感谢

原文由 Lakshya 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

现在，是2020年

请注意（出于以下原因？）Chrome 已更改其自动播放政策（请参阅 https://developers.google.com/web/updates/2017/09/autoplay-policy-changes ）因此您现在必须：

• resume() 一些（任何）用户与页面交互后的音频上下文
• 或“排名靠前”（即相信 Chrome 不会根据用户和世界的行为默认停止音频）
• 或者（据我所知）用户必须在原点 A 然后单击指向相同原点 A 的链接，并且 A 的新页面可以自动播放内容。

---

You can play a sound using the AudioContext API and taking the source from any ArrayBuffer (ie: from a XMLHttpRequest or a File )

     window.addEventListener('load', function () {
        var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
        var source = audioCtx.createBufferSource();
        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'audio-autoplay.wav');
        xhr.responseType = 'arraybuffer';
        xhr.addEventListener('load', function (r) {
            audioCtx.decodeAudioData(
                    xhr.response,
                    function (buffer) {
                        source.buffer = buffer;
                        source.connect(audioCtx.destination);
                        source.loop = false;
                    });
            source.start(0);
        });
        xhr.send();
    });

实例

适用于移动设备和桌面设备的 Chrome 和 Firefox

重要笔记

值得一提的是，IMO，这个“技巧”实际上可以被视为浏览器错误，并且如果浏览器认为这会破坏用户体验/成为广泛使用的烦恼（如广告），则可能随时不再起作用。

还值得一提的是，至少在我的手机和 FF 54 上，声音仍然会播放，即使你的手机静音…

还值得一提的是，用户可以通过浏览器的常用选项或更高级的选项或更高级的 autoplay 行为来满足他们的愿望和需求 about:config 页面 ( autoplay 行为由 Firefox 的 media.autoplay.enabled 和 media.block-autoplay-until-in-foreground 首选项设置）。

因此，无论您如何操作， 强制音频 autoplay 都是一个糟糕的 UX 想法。

原文由 Xenos 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

无法在移动浏览器中进行自动播放。 （这是不允许的）

但是有些技巧可以做到这一点。

点击下面的链接查看一些技巧

在移动 safari 上自动播放音频

iOS 特定注意事项 |循环属性

原文由 Ender Kaya 发布，翻译遵循 CC BY-SA 3.0 许可协议