暂停视频时出错 - 未捕获(承诺中)DOMException:由于媒体已从文档中删除,所以 play() 请求被中断

问题描述 投票:0回答:1

我有一个下一个 js 应用程序,它有一个滑块,其中包含博客风格的帖子 - 每个帖子都包含一个设置为组件的视频。用户可以通过单击菜单按钮之一来加载新的滑块(帖子列表) - 这基本上是通过更改状态并根据所选值显示滑块和新帖子列表来处理的。

在幻灯片上,我具有允许用户播放或暂停视频的功能。此外,如果用户移至下一张幻灯片并且视频正在播放,则在窗口外时视频会暂停(使用观察者)。

一切通常都可以工作,除了有时(当猴子测试时,就好像我是一个患有多动症的 5 岁孩子一样)如果用户选择一张新幻灯片,则会抛出上述错误,并且应用程序最终会冻结并变得无响应

我认为错误的原因是因为 play() 是异步的并且当我离开时

  • 视频已从 DOM 中删除
  • 承诺解决了,但无法暂停视频,因为它不再存在了

这是我处理视频组件中的代码的方式 - 它修复了之前的错误(未捕获(承诺)DOMException:播放()请求被调用暂停()中断)但我不知道如何清理以防止从 DOM 中删除错误

(仅需要在 Chrome 中工作)

const playPromise = video.play()

    if (playPromise !== undefined) {
      playPromise
        .then((_) => {
          video.pause()
          video.currentTime = 0
        })
        .catch((error) => {
          console.log('error', error, )
        })
    } 
javascript next.js promise html5-video pause
1个回答
0
投票

我有同样的问题 你解决了吗?

© www.soinside.com 2019 - 2024. All rights reserved.