自動播放注意事項

在本主題中，您將了解有關頁面載入時自動播放視訊的問題。

概覽

使用 Brightcove 播放器在頁面加載時自動播放視頻並不是一個簡單的問題。這源於瀏覽器供應商響應用戶希望沒有自動播放視頻。本文件將詳細說明各種瀏覽器中自動播放視訊的目前狀態，以及影響自動播放的 Brightcove Player 組態。

我們有一套測試用例。

底線

如果你只是想要我們最好的建議，沒有細節：

無用戶端廣告的自動播放

這些步驟將提供在沒有用戶端廣告或 SSAI 的玩家中自動播放成功的最佳機會：

  • 組autoplay至"any"
  • 設定playsinline為true (適用於 iPhone)

用戶端廣告自動播放

自動播放設置因您使用的 IMA 插件版本或您是否使用 FreeWheel 而異。

IMA3（最新）

這些步驟將提供在帶有客戶端廣告的播放器中成功自動播放的最佳機會（IMA3 插件 v4）：

  • 組autoplay至"any"
  • 設定playsinline為true (適用於 iPhone)
  • 通過播放器的JSON配置配置廣告插件，不通過側面加載或自定義捆綁

IMA3 v3 或 FreeWheel

這些步驟將提供在帶有客戶端廣告（IMA3 v3 或 FreeWheel）的播放器中成功自動播放的最佳機會：

  • 組autoplay至true
  • 設定playsinline為true (適用於 iPhone)
  • 通過播放器的JSON配置配置廣告插件，不通過側面加載或自定義捆綁

設定自動播放

布萊特灣播放器支援五種可能的自動播放值。在HTML5規範中，自動播放是一個布爾屬性-它在（true）或關閉（false）。在布萊特灣玩家中，我們有三個特殊值可供選擇：

  • play：這將導致Brightcove Player呼叫play()設置來源時。
  • muted：這將導致Brightcove Player靜音播放器並呼叫play()。
  • any：這將導致Brightcove Player呼叫play()。如果失敗，它將使播放器靜音並呼叫play()再次。

標籤屬性不支持這三個值！

優先順序

下列清單說明可以設定自動播放的所有方式，以及在 Brightcove Player 初始化程序中的優先順序。

  1. 視頻元素屬性

    遵循HTML5標準，可以是true（屬性存在）或false（屬性不存在）。

    與查詢參數值（僅在其他情況下的 iframe）贏得的其他屬性不同，屬性在這裡獲勝，因為它在 Video.js 中獲勝。

    <video-js autoplay controls></video-js>
  2. URL哈希或查詢字符串

    與大多數情況不同的是，出於回溯相容性的原因，所有內嵌類型的自動播放查詢字串參數或 URL 雜湊參數都受到尊重。

    對於將來的主要版本中的頁面內嵌入，應將其刪除。

    參數存在等於true，即?autoplay&foo=bar，但支持字符串值，例如?autoplay=muted&foo=bar

    您無法將自動播放設置為false通過查詢/哈希參數！

  3. videojs() / bc()選件

    自動播放選項可以傳遞給bc()功能。

  4. JSON配置

    如果選項中無法使用自動播放，請使用從播放程式的 JSON 設定傳入的任何值。

  5. 默認

    最後，如果以上都不適用，則默認為false。

瀏覽器設定與策略

瀏覽器近年來變得更加一致，但以下章節總結了每個主要瀏覽器的可用設置和/或政策。

野生動物園

在 macOS 上的野生動物園具有以下設定：

  • 允許所有自動播放
  • 用聲音停止媒體（默認）
  • 永不自動播放

此外，這些設定可以變更每個站台為基礎。

野生動物園（iOS 和 iPad）

iOS 和 iPad 上的 Safari 並沒有面向使用者的自動播放設定，但會實作下列原則：

  • 靜音的自動播放將始終運作
  • 使用聲音自動播放需要使用者手勢
  • 在iPhone上，playsinline在所有情況下，該屬性都是必需的。

讀此WebKit博客文章有關更多細節。

Chrome

Chrome 沒有面向使用者的自動播放設定，但會實作下列原則：

  • 靜音自動播放應該始終有效 - 但那是總是取決於瀏覽器；我們遇到了一些它沒有的邊緣情況，但我們無法控制它們。
  • 自動播放聲音需要用戶手勢或足夠高的 MEI（在桌面上）。

讀此Chrome博客文章有關更多細節。

Firefox

Firefox 在全球和每個網站都有以下設置：

  • 允許音訊和視訊
  • 阻止音頻（默認）
  • 封鎖音訊和視訊

Edge

依預設，Edge 具有下列設定：

  • 允許（默認）
  • 限制

但是，通過edge://flags/#edge-autoplay-user-setting-block-option，可以恢復“邊緣（傳統）”中可用的“阻止自動播放”選項。

邊緣 (舊式)

Edge (舊版) 具有下列設定：

  • 允許
  • 限制
  • 圖塊

[限制] 選項與其他瀏覽器類似，因為它需要靜音的自動播放或使用者手勢。

已知問題

頁面內來源和程式設計自動播放

使用頁內資源時存在一個已知問題（例如通過<source>元素）和調用play() .

這已經在 Firefox 中看到了，但它可能存在於其他瀏覽器中。

對於Brightcove客戶而言，這不是常見的用例。由於創建播放器後會加載視頻雲源，因此不會發生此問題。

相反，您必須等待canplay調用前觸發事件play()。或者，配置autoplay: true將按預期工作，具體取決於用戶設置/首選項。

ima3/輪/輪

遺失或錯誤的預備

如果嘗試打電話play()使用這些插件，在某些情況下自動播放會失敗，並且單擊“播放”按鈕時，不會播放任何預卷。

關於FreeWheel，也有關於預卷播放的報導背後大播放按鈕。

建議

使用這些外掛程式時，建議啟用自動播放的方法是：

  • 將插件捆綁到您的播放器中（例如通過 Studio）。不建議橫向加載（頁內）。
  • 請勿嘗試使用特殊的自動播放值。將自動播放設置為true並允許廣告插件嘗試播放。