Rails error: Autoplay is only working sometimes for video_tag

Question

我正在使用 Carrierwave 上传视频文件，我的 video_tag 的 autoplay 和 loop 都设置为 true。视频最初上传后会自动播放，但在我刷新页面后只显示视频的第一帧。

video_tag 的来源：

video_tag post.video_url.to_s, autoplay: true, loop: true, class: :standard_post_video

https://github.com/ethanwilkins/simplr/blob/2c07884d153192566ded30bd020c06237747f401/app/views/posts/_card.html.erb#L87

我也在使用 Nginx 和 Unicorn。谢谢！

Answer 1

将 muted: "muted" 添加到我的 video_tag 允许我检查视频是否正在播放，然后在必要时调用 play()。这解决了我的问题：

    <%= video_tag post.video_url.to_s, autoplay: true, loop: true, muted: "muted", class: :standard_post_video, id: "standard_post_video_#{post.id}" %>
    <script>
      var video = $('#video').get(0);
      if (video.paused) {
        video.play();
      }
    </script>

提交：https://github.com/ethanwilkins/simplr/commit/4eea13ee610b4744f555cfba3696da6ac492b622

Answer 2

只需添加

muted: 'muted'

在video_tag

video_tag post.video_url.to_s, autoplay: true, loop: true, muted: 'muted', class: :standard_post_video

查看文档：https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

Chrome 的自动播放策略很简单：

• 始终允许静音自动播放。

• 如果满足以下条件，则允许有声自动播放：

  • 用户与域进行了交互（点击、点击等）。
  • 在桌面设备上，已超过用户的媒体参与指数阈值，这意味着
  • 用户之前播放过有声视频。

  • 在移动设备上，用户已[将网站添加到他们的主屏幕]。

  • 顶级框架可以将自动播放权限委托给它们的 iframe 以允许自动播放声音。