Modernizr 自动播放检查在 Safari 桌面上错误地失败答案

【问题标题】：Modernizr autoplay check fails incorrectly on Safari DesktopModernizr 自动播放检查在 Safari 桌面上错误地失败
【发布时间】：2016-03-16 12:23:11
【问题描述】：

我正在使用此处显示的 Modernizr 代码http://codepen.io/davidgenetic/pen/FmHaD 来检查是否支持自动播放。这在第一次在 Safari 桌面 (v 9.0.1) 上查看该站点时有效，但之后失败（错误地断定不支持自动播放）。删除缓存并重新加载页面使其再次工作。在其他浏览器（Chrome、IE、Firefox、Opera）上，这可以正常工作。有谁知道如何解决这个问题？

Modernizr.addTest('autoplay', function(){

// Audio file data URIs from comments in
// [this gist](https://gist.github.com/westonruter/253174)
// via [mudcube](https://github.com/mudcube)
var mp3 = 'somesong.mp3';

try {
    var audio = new Audio();
    var src = audio.canPlayType('audio/ogg') ? ogg : mp3;
    audio.autoplay = true;
    audio.volume = 0;

    // this will only be triggered if autoplay works
    audio.addEventListener('play', function() {
        Modernizr.autoplay = true;
      // is there a better way to re-evaluate the html classes added by Modernizr?
      var root = document.getElementsByTagName('html')[0];
      root.classList.remove('no-autoplay');
      root.classList.add('autoplay');

      // or if you're using jQuery:
      // $('html').toggleClass('no-autoplay autoplay');
    }, false);

    audio.src = src;
} catch(e) {
    console.log('[AUTOPLAY-ERROR]', e);
}

return false;});

【问题讨论】：

无法使用您提供的 codepen 进行复制。使用 Safari 版本 9.0.2 (10601.3.9) 运行 OSX 10.10.5。总是显示支持我。

标签： jquery safari modernizr

【解决方案1】：

您在 CodePen 中找到的名为 Modernizr support for autoplay property 的代码与 Modernizr 无关。此代码由 Peter Coles 早在 2013 年 5 月编写，然后由 CodePen 作者修改以具有类似于 Modernizr 的功能。

latest version of Modernizr (v3) 具有视频自动播放检测功能。不幸的是，我没有看到任何有关音频自动播放检测的信息。

我确实看到一个 pull request from GrantPax 向 Modernizr 添加音频自动播放功能。如果获得批准，它应该会在不久的将来上市。

与此同时，您可以做以下两件事之一：

查看 GrantPax 的拉取请求代码并使用它。请注意，它可能还没有经过太多测试。
看看有没有人有good non-Modernizr solution。
使用 Modernizr 的视频自动播放检测。我猜支持视频自动播放的浏览器也将支持音频自动播放。但是，这只是一个猜测，所以不要相信我的话。

如果您同意我的假设，那么如果您导入最新版本的 Modernizr 并添加了视频自动播放功能，那么以下代码应该适合您。

var audioClip = document.getElementById("myAudio");
if (Modernizr.videoautoplay) {
  audioClip.autoplay = true;
}
audioClip.load();

【讨论】：