MediaSourceList 拦截器

ESMediaSourceList拦截器是ESPlayerManager调用ESMediaSourceList之前执行的钩子函数。

拦截器中,可以对ESMediaSourceList中所有的数据进行操作。

应用场景一:

播放地址列表之前需要根据媒资 id 获取所有地址列表信息。

设置数据ESMediaSourceList中的list暂时为空

const mediaSourceList: ESMediaSourceList = {
  index: 0,
  list: [],
  interceptors: [interceptor],//添加异步获取地址拦截器
}

可以通过拦截器异步请求到地址列表数据后,赋值给ESMediaSourceList中的list

MediaSourceList 全局拦截器

ESMediaSourceList全局拦截器可以在整个应用中所有播放视频的位置ESMediaSourceList执行钩子函数操作。

第一步、声明全局拦截器

实现ESIPlayerInterceptor接口。

  • id需确保整个应用唯一性。
  • type需明确指定为ESPlayerInterceptorType.ES_PLAYER_INTERCEPTOR_TYPE_MEDIA_SOURCE_LIST
  • intercept方法的参数paramsparams[0]ESMediaSourceList。 在次方法中进行业务逻辑,需要返回promise。 如果业务逻辑认为拦截成功则需返回Promise.resolve(ESPlayerInterceptResult)此时ESPlayerInterceptResult中的result字段会全部赋值到 ESMediaSourceList播放继续进行。 如果业务逻辑认为拦截失败则返回Promise.reject()播放返回错误,终止进行。
  • release方法中有需回收资源
export function createESPlayerMediaSourceListGlobalInterceptor(): ESIPlayerInterceptor {

  function intercept(...params: Array<any>): Promise<ESPlayerInterceptResult> {
    //1.转换成 ESMediaSourceList
    const mediaSourceList = params[0] as ESMediaSourceList

    //2.模拟操作:给 ESMediaSourceList 添加数据
    mediaSourceList.metadata = '全局拦截器添加的附加信息'
    const mediaSource: ESMediaSource = {
      uri: 'http://qcloudcdn.a311.ottcn.com/data_center/videos/SHORT/DEFAULT/2023/09/07/a2d3da6d-469e-4f99-a2d0-c001741003f8.mp4'
    }

    //3.如果返回 Promise.resolve(result)  播放继续
    // 则会把 ESPlayerInterceptResult中的 result 字段全部赋值到 ESMediaSourceList
    // 如果返回 PPromise.reject('模拟失败') 播放终止,返回错误
    //
    const result: ESPlayerInterceptResult = {
      result: {
        list: [mediaSource],
        desc: '拦截器添加的新的字段'
      }
    }
    return Promise.resolve(result)
    // return Promise.reject('模拟失败')
  }

  function release(): void {
    //
  }

  return {
    id: 'ESPlayerMediaSourceListGlobalInterceptor',
    type: ESPlayerInterceptorType.ES_PLAYER_INTERCEPTOR_TYPE_MEDIA_SOURCE_LIST,
    intercept,
    release
  }
}

第二步、注册全局拦截器

//1.创建全局拦截器
const globalInterceptor = createESPlayerMediaSourceListGlobalInterceptor()
//2.注册全局拦截器
const globalInterceptorManager = useESPlayerInterceptorManager()
globalInterceptorManager.addInterceptor(globalInterceptor)

MediaSourceList 局部拦截器

ESMediaSourceList局部拦截器可以在此次播放中ESMediaSourceList执行钩子函数操作。

第一步、声明局部拦截器

实现ESIPlayerInterceptor接口。

  • id需确此次播放中的唯一性。
  • type需明确指定为ESPlayerInterceptorType.ES_PLAYER_INTERCEPTOR_TYPE_MEDIA_SOURCE_LIST
  • intercept方法的参数paramsparams[0]ESMediaSourceList。 在次方法中进行业务逻辑,需要返回promise。 如果业务逻辑认为拦截成功则需返回Promise.resolve(ESPlayerInterceptResult)此时ESPlayerInterceptResult中的result字段会全部赋值到 ESMediaSourceList播放继续进行。 如果业务逻辑认为拦截失败则返回Promise.reject()播放返回错误,终止进行。
  • release方法中有需回收资源
export function createESPlayerMediaSourceListInterceptor(): ESIPlayerInterceptor {

  function intercept(...params: Array<any>): Promise<ESPlayerInterceptResult> {
    const mediaSourceList = params[0] as ESMediaSourceList
    mediaSourceList.metadata = '拦截器添加的附加信息'
    const mediaSource: ESMediaSource = {
      uri: 'http://qcloudcdn.a311.ottcn.com/data_center/videos/SHORT/DEFAULT/2023/08/25/7d3623ae-c002-4929-b5a2-fe10bca06bfc.mp4'
    }
    const result: ESPlayerInterceptResult = {
      result: {
        list: [mediaSource],
        desc: '拦截器添加的新的字段'
      }
    }
    return Promise.resolve(result)
  }

  function release(): void {
    //
  }

  return {
    id: 'ESPlayerMediaSourceListInterceptor',
    type: ESPlayerInterceptorType.ES_PLAYER_INTERCEPTOR_TYPE_MEDIA_SOURCE_LIST,
    intercept,
    release
  }
}


第二步、注册局部拦截器

//1.创建局部拦截器
const interceptor = createESPlayerMediaSourceListInterceptor()
//2.注册局部拦截器
const mediaSourceList: ESMediaSourceList = {
  index: 0,
  list: [],
  interceptors: [interceptor]
}
const mediaItem: ESMediaItem = {
  mediaSourceList,
}
const playList: ESMediaItemList = {
  index: 0,
  list: [mediaItem],
}
playerManager.value?.initialize()

Source

Docs