加载多个页面后，iOS 上的视频失败

Posted 2023-03-13

【中文标题】加载多个页面后，iOS 上的视频失败

【英文标题】：Video fails on iOS after multiple page loads

【发布时间】：2018-12-07 19:15:12

【问题描述】：

我看到本地视频无法仅在 ios 上加载。只有在通过导航进出页面多次加载同一页面后才会发生这种情况。前 10 次左右的视频加载正常，然后将失败并出现媒体错误 3（请参见此处：https://developer.mozilla.org/en-US/docs/Web/API/MediaError）。发生这种情况后，在重新加载之前，应用程序中的其他任何地方都不会播放任何视频。

我使用的是 iOS 11.4，ionic 3。有人有什么想法吗？

html：

<ion-content class="ion-content--pulldown-bg">
    <div class="ion-content-wrapper">
        <video id="vid" loop preload="metadata" playsinline autoplay muted>
          <source src="assets/videos/dummy_video.mp4" type="video/mp4" />
        </video>
    </div>
</ion-content>

打字稿：

  ionViewDidLoad() 
    this.videoElement = document.getElementById("vid") as HTMLMediaElement
    this.videoElement.onerror = () => 
    alert("Error " + this.videoElement.error.code + "; details: " + this.videoElement.error.message)
  

【参考方案1】：

我在这里找到了一个可行的解决方案：MEDIA_ERR_DECODE on HTML5 video in iOS UIWebView after many plays

页面卸载后硬件解码器缓冲区没有删除视频，您必须手动执行。

离子溶液：

ionViewWillUnload() 
    // Clear the videos from the decoder buffer. 
    // Buffer fills up on iOS when multiple videos are loaded
    const elements = document.getElementsByTagName("video")
    for (let i = 0; i < elements.length; i++) 
        elements[i].src = ""
        elements[i].load()