1

我正在使用 ReactJS,我正在尝试显示一个视频,用户只能在观看整个视频后继续。我目前正在使用一个名为 React-player 的依赖项,它可以选择检查它何时结束,但是用户可以跳过视频。

有没有办法检查视频是否播放了一段时间?或者是否可以禁用转发?

这是我目前的代码:

    <ReactPlayer
        onEnded={() => setVideoEnded(true)}
        url={
            "https://...server.net/NodeUploadServer/public/" +
            course.video
        }
        width="100%"
        height="100%"
        controls={true}
    />

    <Button disabled={!videoEnded} >
      Go to test
    </Button>
4

1 回答 1

1

以下是您的问题的两种可能的解决方案:

使用自定义播放器 UI

第一个解决方案是删除渲染时间线组件的默认播放器控件。但是,使用此解决方案,您将需要创建自定义 UI。

跟踪播放时间

react-native 播放器确实有一个事件来发布经过的时间,但这不是你要找的。

如果您使用的是 HTML5 视频播放器,则可以利用已播放属性并验证视频是否已播放一定范围。

timeupdate如果没有,您将不得不使用间隔或使用事件来跟踪播放的时间。

于 2020-10-16T15:31:51.907 回答