問題介紹

瀏覽器為了防止網(wǎng)頁自動播放音視頻對用戶造成干擾，對音視頻的自動播放功能做了限制：在用戶沒有與網(wǎng)頁產(chǎn)生交互（例如點擊、觸摸頁面等）之前，帶有聲音媒體元素的網(wǎng)頁將被禁止自動播放（Chrome中的自動播放策略，Safari中的自動播放策略）。一般情況下純視頻的播放不會受到限制，但有些場景例如低電量模式下的 iOS Safari 瀏覽器以及開啟限制的 iOS WKWebView 中（如 iOS 微信瀏覽器），純視頻的自動播放也會受到限制。

當受到策略影響時，如果在用戶發(fā)生交互之前調(diào)用DingRTC Web SDK音視頻軌道的play方法來播放音視頻，可能會出現(xiàn)播放無聲或看不到視頻的問題。

應(yīng)對方式

• 監(jiān)聽"autoplay-failed"事件，在媒體元素播放失敗的時候給予提示引導(dǎo)用戶與頁面交互來恢復(fù)播放。

  // 其回調(diào)參數(shù)即為自動播放失敗的音視頻軌道
  DingRTC.on('autoplay-failed', (track) => {
    Modal.centerConfirm({
      content: '由于瀏覽器自動播放限制，點擊確定后才會開始播放音頻',
      onOk: () => {
        track.play();
      },
    });
  });
  

• 提前引導(dǎo)用戶與頁面交互（點擊、觸摸等），之后再調(diào)用play方法播放音視頻軌道。

  大部分瀏覽器在用戶交互后即可解決自動播放的限制，但由于各家廠商對自動播放失敗的策略實現(xiàn)存在差異，即使之前用戶已與頁面進行交互，也有可能出現(xiàn)自動播放失敗，例如iOS的微信瀏覽器及其小程序的Webview，這種情況建議可以增加引導(dǎo)用戶點擊/觸摸的交互，在點擊/觸摸事件的回調(diào)中播放音視頻軌道。