当用户离开页面时,视频代码会自动播放暂停

Video tag autoplay pauses when user navigates away from page

提问人:ZooPanda 提问时间:11/16/2023 最后编辑:ZooPanda 更新时间:11/16/2023 访问量:23

问:

我有一个视频标签,如下所示

<video
        muted
        controls
        autoPlay
        src={videoSrc}
        width="640px"
        height="480px"
        onEnded={handleOnEnded}
        ref={videoRef}
      />

通过 react 状态 videoSrc(websocket 流式传输的 blob 上的 createObjectUrl)从 websocket 流式传输视频。这工作正常。

但是,问题在于,在 blob 完成播放之前,如果我更改选项卡,页面仍处于打开状态(并且仍在播放),视频会暂停,并且仅在我导航回页面时才会恢复。为什么会这样?是浏览器优化吗?

如何防止这种情况发生(我希望视频继续播放,例如当我离开 Youtube 时,我打开的视频会继续播放)

Python ReactJS 打字稿 视频

评论

0赞 spender 11/16/2023
当我从页面“导航离开”时,我希望所有内容都卸载。我错过了什么?
0赞 ZooPanda 11/16/2023
@spender啊,让我澄清一下,我不是说导航离开,而是更改选项卡(同一页面仍然打开)
0赞 Beavatron Prime 11/16/2023
您在哪些浏览器上测试过?页面有没有模糊的听众?视频渲染器的默认 onblur 事件是什么?您是否尝试过在视频标签中添加 onblur 覆盖?
0赞 ZooPanda 11/16/2023
@BeavatronPrime我使用的是 chrome 118,但我还没有尝试使用 onBlur。你能给我举个例子吗,它将如何帮助这里?编辑:我尝试添加一个 onBlur 函数 ''' const handleOnBlur = () => { const video = videoRef.current; return video?.play();};'''但它似乎没有用。出现同样的问题

答: 暂无答案