回放功能 · Netless

前提条件

确定向服务器请求创建房间时，设置为isRecord，详情请查看服务端文档-白板类型。

阅读初始化参数-回放参数了解初始化回放时，所需要的参数。

本节中player为sdk调用replayRoomAPI 后，成功返回的player对象。

white-react-sdk

white-react-sdk，可以使用如下方式进行绑定操作：

import React from "react";

class App extends React.Component {
    render() {
        return <PlayerWhiteboard player={player}/>;
    }
}

音视频支持

sdk支持在回放时传入音视频地址，具体请查看初始化参数-回放参数。sdk会主动接管音视频播放，负责处理音视频与sdk``player的播放状态同步问题。
当白板回放与音视频，任意一个进入缓冲状态时，sdk会自动停止另一个的播放，等待另一方缓冲完毕，并且同时触发player的缓冲状态回调。

音频

音频，只需要根据初始化参数-回放参数，配置正确的音频地址。

视频

1. 创建 video 标签

创建需要显示的video标签，并将id设置为white-sdk-video-js。（开发者可以根据业务需要，自行配置该标签的布局）。

2.2.13 以前的版本，请在video标签中，添加css名video-js

<!-- 根据业务需求，自行设置布局方式 -->
<video id="white-sdk-video-js" class="video-js"></video>

2. 引用 videojs css

在 <head> 标签中引用 sdk

2.3.0 及其以前的版本，需要手动引用 videojs 的 css，

<head>
<link rel="stylesheet" href="https://vjs.zencdn.net/7.6.0/video-js.css">
</head>

使用 npm 等包管理工具

目前video-js为sdk的dependency依赖，会自动安装。只需要在对应页面调用手动 import 即可。

import "video.js/dist/video-js.css";

局限性——Safari 限制

由于iOS（包括iOS微信浏览器以及浏览器App）以及macOS``Safari的隐私限制——无法通过代码播放音视频（标记muted的视频，可以），而sdk需要同步白板回放与音视频播放，会通过代码进行暂停与播放，所以会造成在iOS以及macOS的Safari上无法正常播放。

解决办法

在初始化后，主动调用player.seekToScheduleTime(0)触发音视频，以及白板的缓冲，从而保证开发播放时

回放时状态监听

具体请参考状态管理文档与初始化参数-回放参数

主动操作API

播放

player.play();

快进

你可以通过如下方法快进到特定时间点。scheduleTime 是一个>=0的整数（毫秒），它不应该超过回放片段的总时间。

player.seekToScheduleTime(scheduleTime);

暂停

player.pause();

观察模式

TypeScript 签名

//player.d.ts
export enum ObserverMode {
    // 跟随当前主播视角，如果当前没有主播，则跟随最早加入房间的用户
    Directory = "directory",
    // 自由模式
    Freedom = "freedom",
}

// 和实时房间相同，一旦用户进行主动移动，就会变成 freedom 模式
player.setObserverMode("directory");

终止——施放资源

使用该 API 后， player 不再可用，如果需要播放，请重新生成新的实例

player.stop();