videojs-contrib-ads 已发布重大更新。在本文中，我们将探讨 videojs-contrib-ads 提供了什么以及第 6 版有哪些改进。

什么是 contrib-ads？

Videojs-contrib-ads 是一个用于创建 Video.js 广告插件的框架。将广告支持无缝集成到视频播放器可能是一项艰巨的任务，特别是当您有其他可能受影响的插件时。例如，播放广告可能会导致额外的媒体事件。想象一个监听“loadstart”事件的分析系统：当前贴片广告导致额外的 loadstart 事件时，它将开始看到重复的事件。contrib-ads 有一个名为Redispatch 的功能，可以确保广告不会触发额外的媒体事件。这使得事情尽可能简单，同时不会破坏其他插件。使用 contrib-ads 的额外好处已在自述文件中列出。

第 6 版

contrib-ads 的第 6 版是一个维护版本，包含了主要的重构。项目核心行为由一个状态机处理，它在播放器播放内容、贴片广告、中插广告和片尾广告时在各种状态之间前进。最初的状态机在项目首次构思时被设计用于实现一组特定的功能。多年来，该项目变得功能更加完善，并出现了许多新场景和边缘情况。在这次重构中，状态机已更新，以精确匹配现代功能集。这使得代码库更易于维护且更可靠。

工作原理

广告模式被严格定义为 内容播放是否被广告插件阻塞。

contrib-ads 有一个称为 广告模式 的概念。广告模式被严格定义为 内容播放是否被广告插件阻塞。这不一定意味着广告正在播放。例如，如果有一个贴片广告，在播放请求后，我们显示一个加载动画直到广告开始播放。这被认为是广告模式的一部分。公共方法 player.ads.isInAdMode() 可用于检查我们是否处于广告模式。

在第 6 版中，状态机进行了重构，以匹配广告模式的严格定义。有两种状态：内容状态和广告状态。如果 contrib-ads 处于广告状态，则它处于广告模式。

这是新状态的图示。蓝色状态是内容状态，黄色状态是广告状态

广告状态图

关于状态机如何随时间演变的历程，可以在此 Github Issue 中找到详细信息。在本文中，我们将重点介绍它在第 6 版中的工作原理。

让我们来看一个简单的贴片广告场景中的状态。contrib-ads 从 BeforePreroll 状态开始。这被视为一个内容状态，因为内容播放尚未被请求，所以广告并未阻塞播放。在此期间，广告插件可以异步地从广告服务器请求广告，即使插件处于内容模式。当广告插件准备好时，它会触发 adsready 事件。contrib-ads 知道一旦按下播放按钮，广告就已经准备好了。

现在用户点击播放。此时广告模式开始，contrib-ads 进入 Preroll 状态。Preroll 状态会显示一个加载动画，直到广告开始播放。Preroll 状态知道广告插件已准备就绪且已点击播放，因此触发 readyforpreroll 以通知广告插件是时候播放广告了。一旦广告开始播放，控制条会变成黄色且不允许快进。如果广告播放时间过长，将发生超时，内容将立即恢复播放。当广告播放完毕后，contrib-ads 会恢复内容视频。只有当内容播放产生 playing 事件时，广告模式才会结束。

现在我们处于 ContentPlayback 状态。此时，广告插件可能会播放中插广告，导致短暂进入 Midroll 状态，或者内容可能会不间断地继续播放。

当内容结束时，通常我们会立即看到一个 ended 事件。相反，contrib-ads 会发送一个 contentended 事件，这是广告插件播放片尾广告的机会。也许广告插件已决定不播放片尾广告，因此它通过触发 nopostroll 来响应。contrib-ads 知道现在我们真的完成了，因此会触发一个 ended 事件。

最后，由于内容首次结束，我们现在过渡到 AdsDone 状态。即使用户向后跳转并再次播放内容，也不会再有广告。

结论

广告可能不是您在线观看视频最喜欢的部分，但 contrib-ads 确保它们不会破坏您的网站，并且即使广告失败内容也能正常播放。如果您有兴趣了解更多或为该项目做出贡献，请在Github 上查看！