播放器使用方式

本文檔主要提供播放器模組下的播放器使用方式 Api 文件。

一、建立播放器

透過 setupPlayer 建立觀看頁的播放器。

lowLatency 參數負責控制播放器是否使用無延遲播放，開啟後若當前為無延遲頻道並且裝置支援無延遲播放則使用無延遲進行播放，開發者可透過 supportLowLatency 方法判斷當前環境和頻道是否支援無延遲。

透過 PlayerEvents.PlayerInited 監聽播放器建立並初始化完成事件，當觸發該事件後即可呼叫播放器模組的其他方法，如：play、pause。

Api 方法： setupPlayer(options: SetupPlayerOptions): Promise<void>

參數說明：

• options：建立參數，SetupPlayerOptions 類型，必傳，詳細類型說明如下

範例：

const playerCtx = this.selectComponent('#player-bridging');
await watchCore.player.setupPlayer({
  lowLatency: true, // 使用无延迟播放
  playerContext: playerCtx,
});

二、取得播放器資訊

播放器模組會儲存播放器的狀態資訊，透過 getPlayerInfo 方法取得當前播放的所有狀態。

Api 方法： getPlayerInfo(): PlayerStoreInfo

回傳值說明： 播放器資訊，PlayerStoreInfo 類型，詳細類型說明如下

範例：

const playerInfo = watchCore.player.getPlayerInfo();
console.log('播放状态', playerInfo.playStatus); // playing or pause
console.log('是否支持无延迟', playerInfo.supportLowLatency);
console.log('是否无延迟', playerInfo.isLowLatency);

三、無延遲

3.1 是否支援無延遲觀看

透過 supportLowLatency 方法取得當前環境和頻道是否支援無延遲觀看。

Api 方法： supportLowLatency(): SupportResult

回傳值說明： 支援結果，SupportResult 類型

範例：

const supportResult = watchCore.player.supportLowLatency();
if (supportResult.support) {
  console.log('支持无延迟观看');
} else {
  console.log('不支持无延迟观看');
}

四、播放/暫停

4.1 恢復影片播放

透過 play 方法觸發播放器播放直播流或影片。

Api 方法： play(): void

範例：

// 恢复播放
watchCore.player.play();

4.2 暫停影片播放

透過 pause 方法暫停影片播放。

Api 方法： pause(): void

範例：

// 暂停播放
watchCore.player.pause();

五、回放

5.1 設定播放進度

當觀眾拖曳回放進度條時，透過 seekVideo 設定回放播放進度。

Api 方法： seekVideo(time: number): void

參數說明：

• time：播放時間，單位秒，number 類型，必傳

範例：

// 切到 1 分 20 秒
watchCore.player.seekVideo(120);

六、播放器設定

6.1 取得播放器暖場設定資訊

用於取得管理後台設定的播放器暖場資訊，注意暖場設定有一定延遲，需要透過 PlayerEvents.PlayerWarmUpSettingChange 事件監聽資訊更新。

Api 方法： getPlayerWarmUpSetting(): PlayerWarmUpSetting

回傳值說明： 播放器暖場設定，PlayerWarmUpSetting 類型，詳細類型說明如下

範例：

watchCore.player.eventEmitter.on(PlayerEvents.PlayerWarmUpSettingChange, () => {
  const setting = watchCore.player.getPlayerWarmUpSetting();
  console.log('暖场类型', setting.warmUpType);
  console.log('暖场图片地址', setting.warmUpImg);
  console.log('暖场视频地址', setting.warmUpVideo);
});

七、銷毀

7.1 銷毀播放器

頁面或元件銷毀前呼叫 destroyPlayer 銷毀播放器。

Api 方法： destroyPlayer(): void

範例：

watchCore.player.destroyPlayer();