Video.js 博客

Gary Katsevman2018-07-10

Video.js 7.1 和 6.11:自动播放与全屏变更

A laptop playing a video in fullscreen mode.
一台笔记本电脑正在全屏模式下播放视频。

距离上一次发布已经有一段时间了。7.1.06.11.0 版本的 Video.js 包含了贡献者和维护者提供的众多出色功能。两项重大变更与自动播放——我们什么时候才能停止讨论自动播放?——以及全屏功能有关。此外,还有更多内容。

Video.js 7.1.0 和 6.11.0 已分别作为 nextnext-6 在 npm 上发布。

通过 npm 获取 7.1.0

npm install video.js@next

通过 npm 获取 6.11.0

npm install video.js@next-6

自动播放

我们一直在关注浏览器厂商围绕自动播放所做的变化。我们还做了大量工作,以使 Video.js 能够尽可能好地适应新的自动播放策略。然而,仍然有一些未被考虑到的用例。为了解决这些问题,我们决定扩展现有的 Video.js autoplay 选项,以包含几个新值:mutedplayany。当前的布尔选项将像现在一样工作,未知选项也将像现在一样处理。

  • muted - 这将在 loadstart 时调用 play() 之前将视频元素设为静音。
  • play - 这将在 loadstart 时调用 play()。这类似于 autoplay 属性,但使用的是调用播放而不是属性。
  • any - 这将在 loadstart 时调用 play(),但如果失败,它将尝试静音播放器并再次尝试 play()

全屏

这些版本中有两项与全屏相关的变更。

第一个是经常被请求的功能,它终于来了:双击切换全屏。在播放器区域内——控制栏和模态对话框之外——双击将进入或退出全屏播放。

第二个变化是如果全屏不可用,则禁用全屏切换,例如在没有 allowfullscreen 属性的 iframe 内部。

Fullscreen available
全屏可用
Fullscreen unavailable
全屏不可用

显著变化

  • 使“main-desc”类型的音轨显示音频描述图标
  • 通过 autoprefixer 处理我们的 CSS,这会稍微减小输出大小。
  • 即使无法通过编程方式更改音量,如果静音是可能的,也要显示静音切换。例如,在 iOS 上。
  • setSource 作为中间件的选项。

鸣谢

感谢所有为本次发布做出贡献的人!