开放平台
平台概述
开发者文档
  • API文档
  • SDK文档
  • 接入指南
  • 集成方案
产品功能
  • 新手入门
  • 产品功能
常见问题首页
平台概述
开发者文档
  • API文档
  • SDK文档
  • 接入指南
  • 集成方案
产品功能
  • 新手入门
  • 产品功能
常见问题首页
  1. Harmony SDK
  • 平台概述
  • 接入指南
    • 业务流程
    • 接入指南
    • 开通账号
    • 平台简介
  • 内嵌指南
    • 直播观看嵌入指南
      • 产品介绍
      • 嵌入说明
      • 嵌入示例
      • 嵌入页消息推送
      • 微信小程序嵌入说明
      • 嵌入模式支付对接
      • 嵌入页第三方K值验证
    • 聚合站点嵌入指南
      • 聚合页嵌入指南
      • 小程序嵌入指南
      • 创建三方用户「站点专用」
      • 更新三方用户「站点专用」
    • 直播管理嵌入指南
      • 产品介绍
      • 嵌入说明
      • 嵌入示例
    • APP嵌入指南
      • 支付方式唤起说明
      • 商品配置说明
  • 服务端API
    • 产品介绍
    • 更新记录
    • 接入必读
      • 快速接入
      • 签名示例
      • 全局状态码
      • 调用频率说明
    • 账号管理
      • 子账号角色
        • 创建子账号角色
        • 更新子账号角色信息
        • 获取子账号角色列表
        • 获取子账号角色详情
      • 子账号管理
        • 创建子账号
        • 更新子账号信息(含角色绑定)
        • 获取子账号个数
        • 获取子账号列表
        • 获取子账号详情
        • 创建子账号应用信息
      • 三方用户管理
        • 创建三方用户
        • 更新三方用户
        • 获取微吼用户ID
        • 获取第三方用户ID
    • 活动中心
      • 标签管理
        • 创建标签
        • 删除标签
        • 更新标签
        • 置顶标签
        • 获取标签列表
        • 批量查询活动标签
        • 活动标签列表排序重置
      • 活动管理
        • 创建活动
        • 创建活动(点播/定时直播)
        • 删除活动
        • 修改活动信息
        • 活动列表接口
        • 获取活动详情
        • 批量获取活动详情
        • 获取活动场次列表
        • 获取当前视频分辨率详情(定时直播)
      • 多语言管理
        • 创建活动语种
        • 删除活动语种
        • 修改活动语种
        • 查询活动语种列表
      • 角色权限
        • 角色邀请开关
        • 角色名称修改
        • 角色密码修改
        • 角色权限修改
        • 获取活动角色配置
        • 取消嘉宾/助理身份
        • 设置主持人身份信息
        • 获取B端用户参会地址
      • 观看限制
        • 全局踢出
          • 批量移除全局踢出观众
          • 查询全局踢出观众列表
          • 新增/编辑全局踢出观众
        • 观众组管理
          • 创建观众组
          • 指定观众组添加新用户
          • 获取观众组分组列表
          • 获取观众组下用户列表
          • 批量移除观众组用户
        • 平台观看限制
          • 设置活动观看限制
          • 查询活动观看限制
        • 外部观众鉴权
          • 外部观众获取活动票据-生成ticket
        • 第三方K值鉴权
          • 设置全局K值鉴权
          • 设置单个活动K值鉴权
          • 删除活动下的k_id
          • 设置活动多K值校验
          • 查询多K值详情列表
          • 查询活动K值详情配置
      • 互动管理
        • 问答
          • 设置问答名称
          • 获取问答名称
          • 删除问答记录
          • 批量删除问答记录
          • 获取问答管理页面
        • 聊天
          • 批量添加聊天屏蔽词
          • 批量删除聊天屏蔽词
          • 清空聊天屏蔽词
          • 修改聊天屏蔽词
          • 获取聊天屏蔽词列表
          • 保存聊天严禁词配置
          • 获取聊天严禁词配置
          • 删除聊天消息
          • 批量删除聊天消息
          • 发送自定义消息
          • 获取直播聊天过滤页面
          • 设置/取消全体用户禁言
          • 获取活动禁言详情
        • 签到
          • 获取进行中的签到任务
          • 创建并配置签到推送
          • 批量删除签到记录
          • 结束签到
          • 获取签到详情
        • 礼物
          • 修改礼物
          • 创建活动礼物
          • 创建礼物
          • 删除礼物
          • 活动关联礼物
          • 获取礼物发送记录
          • 获取礼物收益
          • 观看端_获取活动使用的礼物列表
          • 设置活动下礼物排序
          • 设置活动下礼物是否展示
          • 账号下礼物列表
        • 在线抽奖
          • 抽奖管理
            • 创建或更新抽奖信息
            • 保存或更新抽奖条件与中奖用户设置
            • 保存或更新领奖页设置
            • 复制抽奖
            • 删除抽奖
          • 奖品管理
            • 创建或更新奖品信息
            • 批量删除活动下奖品
            • 保存抽奖奖品设置
            • 获取活动下奖品信息
            • 获取活动的奖品列表
          • 获取抽奖详情信息
            • 获取抽奖条件和用户设置
            • 获取抽奖配置基本信息
            • 获取抽奖领奖页设置
            • 获取活动下抽奖列表
          • 推送抽奖
            • 推送抽奖
          • 结束抽奖
            • 结束抽奖
        • 报名表单
          • 报名审核-批量审核
        • 推屏卡片
          • 创建推屏卡片
          • 发起端-导出点击列表
          • 发起端-推送推屏卡片
          • 发起端-获取推送中的卡片 ID
          • 复制推屏卡片
          • 批量删除推屏卡片
          • 编辑推屏卡片
          • 获取推屏卡片列表
          • 获取推屏卡片点击数据
        • 快问快答
          • 获取活动下快问快答列表
          • 快问快答-推送试卷
          • 快问快答-收卷
          • 快问快答-公布成绩
          • 获取快问快答题目
      • 观看页设置
        • 品牌设置
          • 获取活动标识
          • 设置活动标识
        • 观看协议
          • 保存观看协议
          • 获取观看协议
          • 观看端-用户同意观看协议
          • 观看端-获取观看协议
        • 开屏海报
          • 获取开屏海报设置
          • 设置开屏海报
        • 公众号展示
          • 公众号展示设置
          • 获取公众号设置
        • 功能开关配置
          • 活动配置开关获取
          • 设置功能开关
    • 转推流设置
      • 活动开关播
        • 开始直播
        • 结束直播
      • 平台推流到三方
        • 获取活动下已添加推流地址列表
        • 创建三方推流地址
        • 删除三方推流地址
        • 编辑三方推流地址
        • 开启/关闭三方推流
      • 平台拉流并开播
        • 拉流并开播
      • 获取当前活动推流状态
        • 获取直播间流状态
      • 获取当前活动推流地址
        • 获取直播间推流地址
    • 播放器设置
      • 其他信息设置
      • 获取其他信息设置
      • 水印设置
      • 获取水印设置
      • 跑马灯设置
      • 获取跑马灯设置
    • 回放管理
      • AI创作
        • 获取智能字幕详情
        • 提交智能字幕解析任务
        • 智能字幕-编辑及保存
      • 保存章节-章节打点
      • 创建回放
      • 删除点播与章节关联-章节打点
      • 回放列表
      • 回放删除
      • 回放加密
      • 回放编辑
      • 回放重制
      • 查询章节信息-章节打点
      • 获取回放时长
      • 获取录制文件信息
      • 裁剪回放
      • 设置默认回放
      • 回放下载接口
      • 获取回放分辨率信息
      • 回放清晰度转换接口
      • 获取回放下载信息
    • 专题管理
      • 创建专题
      • 删除专题
      • 修改专题
      • 获取专题列表
      • 获取专题详情接口(专题预览)
    • 营销设置
    • 商品中心
      • 商品池
        • 创建商品
        • 更新商品
        • 商品详情
        • 商品列表
        • 复制商品
        • 批量删除
      • 活动商品
        • 获取当前活动未关联商品
        • 活动关联商品
        • 活动商品列表
        • 批量删除活动商品
        • 活动商品上架设置
        • 设置活动商品排序
        • 设置活动商品销售状态
        • 设置活动商品推送状态
        • 获取活动下商品统计数据
      • 优惠券
        • 优惠券作废
        • 优惠券创建
        • 优惠券批量删除
        • 优惠券数据总览
        • 优惠券更新
        • 活动下优惠券批量删除
        • 活动下优惠券新增
        • 用券商品列表
        • 获取优惠券下商品列表
        • 获取优惠券信息
        • 获取优惠券列表
        • 获取活动下优惠券列表
        • 领用券用户列表
      • 订单管理
        • 查询订单列表
        • 获取订单详情
        • 活动订单设置
        • 查询活动订单设置
    • 媒资中心
      • 图片上传
        • 图片上传
      • 文档管理
        • 删除文档
        • 获取文档详情
        • 获取文档章节
        • 获取活动下的文档列表
        • 上传文档
        • 活动关联文档
      • 音视频管理
        • 视频预览
        • 音视频删除
        • 音视频修改
        • 音视频列表
        • 音视频详情
    • 数据统计
      • 互动数据
        • 基础统计
          • 预约
            • 活动预约列表
          • 报名表单
            • 获取报名表单记录
          • 邀请排名
            • 获取邀请榜
            • 获取邀请列表
            • 获取邀请卡详情
            • 邀请详情
          • 分享排名
            • 获取分享排名记录
        • 互动统计
          • 聊天
            • 获取历史聊天记录
          • 问答
            • 获取问答记录总数
            • 获取问答记录列表
          • 点赞
            • 获取房间的点赞数量
          • 快问快答
            • 获取快问快答答题详情
          • 问卷
            • 获取活动下问卷列表
            • 获取活动下问卷使用数据概览
            • 获取问卷ID对应问卷答案
            • 获取问卷提交人数
            • 获取问卷答案详情
          • 签到
            • 获取已推送的签到记录列表
            • 获取活动下已签到的用户记录
            • 获取活动签到统计列表
            • 签到用户列表接口(聚合表查询数据)
          • 现金红包
            • 获取红包发送记录
            • 获取红包领取列表
            • 获取活动下红包统计数据
          • 口令红包
            • 获取红包明细
            • 获取发送红包记录
            • 获取活动下红包统计数据
          • 打赏
            • 获取活动打赏列表
            • 获取活动打赏统计
          • 文件下载
            • 文档下载次数
            • 已下载资料数据列表
          • 连麦
            • 获取用户上麦记录
      • 活动维度数据
        • 数据报告
          • 活动统计信息
          • 观看人数趋势
        • 终端信息统计
          • 活动设备信息
          • 活动浏览器信息
        • 地理位置统计
          • 省份信息统计
          • 城市信息统计
        • 获取活动热度信息
          • 活动热度信息
        • 获取活动在线人数
          • 获取当前在线人数
          • 获取指定时间段内在线人数统计
        • 获取活动并发数据
          • 每天并发趋势
          • 获取当前活动最高并发
          • 获取指定时间段内活动最大并发
          • 获取当前活动指定时间段内最高并发
        • 获取用户观看明细
          • 获取用户观看明细(新)
          • 获取用户观看明细(旧)
      • 账号维度数据
        • 数据总览
        • 活动数据列表接口
        • 获取指定日期内最高并发
        • 获取指定时间段内并发数据
    • 开发设置
      • 回调事件说明
      • 回调事件列表
      • 回调事件管理
        • 回调事件查询接口
        • 回调事件修改接口
        • 回调事件创建接口
      • 回调事件汇总
        • 活动信息
          • 活动删除
          • 活动创建
          • 活动信息更新
        • 活动状态
          • 活动状态
          • 活动推流状态
          • 活动状态改变
          • 活动恢复预告
        • 回放
          • 生成回放
          • 裁剪回放
          • 回放分辨率
          • 回放下载
          • 回放重制
        • 媒资
          • 视频转码
          • 文档转码
          • 音视频转码进度
        • 订单
          • 订单状态变更
        • AI创作
          • 智能解析
        • 报名
          • 报名表单提交
        • 抽奖
          • 中奖结果通知
          • 抽奖管理
          • 复制抽奖
          • 推送抽奖
          • 结束抽奖
          • 抽奖奖品管理
        • 快问快答
          • 答题记录
        • 签到
          • 推送签到
          • 结束签到
          • 签到管理
        • 商城奖励
          • 领取奖励回调
        • 观看时长
          • 时长达标
        • 房间消息
          • 上下线消息
    • 财务中心
      • 套餐数据查询
        • 并发消费查询
          • 财务总览-并发-消费账单
        • 流量数据查询
          • 6.查询用户流量
          • 查询某段时间内流量使用情况
          • 财务总览-流量-消费账单
        • 时常数据查询
          • 查询每天用户时长使用量
          • 查询指定时间内时长使用情况
          • 财务总览-时长-消费账单
      • 短信数据查询
        • 获取一定时间内短信使用量
        • 获取指定时间内短信消耗总值
        • 财务总览-短信-消费账单-分页明细
    • 授权服务
      • 获取观众登录Token
      • 获取控制台登陆Token
      • 获取控制台免登录地址
  • SDK文档
    • DEMO示例
    • JS SDK
      • web 点播 sdk
        • 更新记录
        • 点播上传SDK
      • web 观播 sdk
        • 产品介绍
        • 快速接入
        • 对接示例
        • 观看直播
        • 文档白板
        • 互动连麦
        • 暖场视频
        • 全局事件
        • 全局错误码
        • 房间消息说明
        • 版本更新记录
        • 互动工具
          • 互动-抽奖
          • 互动-礼物
          • 互动-签到
          • 互动-问卷
          • 互动-公告
          • 互动-商品
          • 互动-问答
          • 互动-推屏卡片
          • 互动-快问快答
          • 互动-聊天
          • 互动-优惠券
          • 互动-点赞
        • 直播间拓展功能
          • 资料下载
          • 观看限制验证
          • 观看协议
          • 回放章节
    • iOS SDK
      • 整体介绍
      • 快速接入
      • SDK 登录
      • 暖场视频
      • 视频轮询
      • 直播彩排
      • 高级美颜
      • 云导播
      • 观看协议
      • 文档白板演示
      • 聊天功能
      • 视频直播
        • 发起视频直播
        • 观看视频直播
      • 互动直播
        • 观众互动
        • 推流摄像头
        • 互动直播API
        • 主播发起互动直播
        • 嘉宾加入互动直播
      • 无延迟直播
        • 主播发起无延迟直播
        • 观众观看无延迟直播
      • 互动工具
        • 互动-抽奖
        • 互动-礼物
        • 互动-签到
        • 互动-问卷
        • 互动-章节打点
        • 互动-公告
        • 互动-商品
        • 互动-计时器
        • 互动-问答
        • 互动-推屏卡片
        • 互动-快问快答
        • 互动-优惠券
        • 互动-点赞
      • 直播间拓展能力
        • 直播间特色功能配置项
        • 文件下载
        • 修改角色昵称
        • 观看权限校验
        • 投屏
        • 虚拟人数
      • 观看回放
        • 观看回放
      • 防录屏
        • 跑马灯
      • 字段说明
        • 互动活动详情字段
        • 错误码说明
        • 常量定义
        • 活动详情字段说明
      • 版本更新说明
        • 版本更新信息
        • v2.3.0 到 v2.4.0 升级说明
        • v3.0.1 到 v3.2.0 升级说明
        • V2.9.0到v3.0.1升级说明
        • v6.3.0
        • v6.2.1
        • v3.2.0 到 v4.0.1
        • v2.7.0 到 v2.8.0、v2.9.0 升级说明
        • 6.5.0
        • v5.0.x 到 v6.0.0
        • v6.4.0
    • Adroid SDK
      • 整体介绍
      • 快速接入
      • SDK登录
      • 暖场视频
      • 视频轮巡功能
      • 直播彩排
      • 高级美颜
      • 云导播功能
      • 观看协议
      • 文档白板
      • 聊天功能
      • 房间消息
      • 信息采集说明
      • 视频直播
        • 发起视频直播
        • 观看视频直播
      • 互动直播
        • 互动直播API
        • 主播发起互动直播
        • 嘉宾加入互动直播
        • 观众观看互动直播
      • 无延迟直播
        • 主播发起无延迟直播
        • 观众观看无延迟直播
      • 互动工具
        • 互动-抽奖
        • 互动-礼物
        • 互动-签到
        • 互动-问卷
        • 互动-公告
        • 互动-商品
        • 互动-计时器
        • 互动-问答
        • 互动-推屏卡片
        • 互动-快问快答
        • 互动-优惠券
        • 互动-点赞
      • 直播拓展功能
        • 修改角色名称
        • 文件下载
        • 投屏演示
        • 虚拟人数
        • 观看权限校验
        • 直播间特色功能配置项
      • 观看回放
        • 观看回放/点播
      • 防录屏
        • 直播水印
        • 跑马灯
      • 字段说明
        • 房间消息字段说明
        • 聊天消息字段说明
        • 活动详情字段说明
      • 更新记录
        • 更新记录
      • 版本更新说明
        • v6.4.0
        • v6.3.0
        • v6.2.3
        • v6.2.1
        • v6.2.0
        • v6.1.0
        • v6.0.0
        • v5.0.0
        • v4.1.0
        • v4.0.0
        • v3.3.0
    • Harmony SDK
      • 整体介绍
      • 快速接入
      • SDK初始化
      • 登录&登出
      • 活动基础信息
      • 观看协议
      • 观看权限校验&预约
      • 开屏海报
      • 暖场视频
      • 观看直播
      • 观看回放/点播
      • 聊天
      • 房间消息
      • 在线人数&热度
      • 文档/白板
      • 版本更新
      • 私聊
      • 播放器错误码
      • 互动工具
        • 互动-问答
        • 互动-问卷
        • 互动-公告
        • 互动-抽奖
        • 互动-签到
        • 互动-计时器
        • 互动-礼物
        • 互动-互动有礼
        • 互动-快问快答
        • 互动-口令红包
        • 互动-推屏卡片
        • 互动-商品
        • 互动-优惠卷
        • 互动-观看有礼
        • 互动-点赞
      • 防录屏
        • 播放器水印&跑马灯
      • 菜单
        • 自定义菜单
        • 文件下载
        • 概要总结
        • 回放列表
        • 邀请卡
    • 微信小程序 SDK
    • 相关协议
      • 微吼直播 SDK 隐私政策
      • 微吼直播 SDK 开发者使用规范
  • 常见问题
    • 平台兼容性说明
    • 直播筹备阶段
    • 直播执行阶段
    • 直播观看阶段
    • 内容数据沉淀阶段
    • 直播相关问题
    • 设备相关问题
    • 对接阶段问题
    • 点播回放相关问题
    • 自动播放策略说明
    • 视频直播OBS推流配置建议
    • 快直播OBS推流配置建议
    • 网络安全策略(防火墙配置)
    • 三方应用唤起微吼直播APP快速参会
  1. Harmony SDK

暖场视频

暖场视频#

在 SaaS 控制台配置上暖场视频,直播预告状态下观众进入直播间可以查看已配置的视频,提升直播活动预热效果,也可以实现直播的预约功能配合使用。

注意事项#

1.必需登录成功之后才可以进入活动
2.暖场视频需要 pc 设置才会有
3.暖场视频底层和回放播放器一样

观看直播步骤#

1.
实例化播放器控制器 - VHWatchVodPlayer
2.
构造直播播放器组件 - VHWatchVodPlayerView
3.
初始化房间信息 - VHWatchVodPlayer.initWebinarInfo (只设置一次)
4.
设置播放器回调事件监听 - VHWatchVodPlayerCallback (监听onPlayerViewInitCompleted后进行播放)
5.
开始播放 - VHWatchVodPlayer.startPlayWithRecordId
6.
暂停播放 - VHWatchVodPlayer.pausePlay
7.
恢复播放 - VHWatchVodPlayer.resumePlay
8.
销毁播放器 - VHWatchVodPlayer.destroyPlayer (退出房间必须调用,只设置一次)

核心类#

类名描述
VHWatchVodPlayer播放器控制核心类
VHWatchVodPlayerView播放器核心组件
VHWatchVodPlayerCallback播放器事件回调

业务处理流程说明#

暖场视频用于在预约或直播前未开播的活动显示用户预设的视频。暖场视频配置通过调用初始化接口返回的VHWebinarData.VHWarmup类。并且满足部分条件才能进行观看。具体参考VHWarmup说明。
//是否满足暖场视频播放条件
  private isEnablePlay(advance_play_time: number): boolean {
    if (advance_play_time == 0) {
      return true;
    }
    let date = new Date(this.webinar_info?.webinar?.start_time!);
    let milliseconds = date.getTime();
    let current = systemDateTime.getTime();
    //未到开播时间
    if (current <= milliseconds) {
      let diff = milliseconds - current;
      // 暖场视频播放
      if (diff / 1000 < advance_play_time) {
        return true;
      } else {
        return false;
      }
    }
    //已经超过开播时间不播放暖场视频
    return false;
  }

//判断是否有暖场视频
if (this.webinar_info && this.webinar_info.warm_up) {
    if (this.isEnablePlay(this.webinar_info.warm_up.advance_play_time)) {
      Column() {
      //构建暖场视频播放器
        VHWarmPlayerView({ webinars: this.webinar_info, player_config: this.player_config })
          .width('100%')
          .height('100%')
      }
      .width('100%')
      .flexShrink(0)
      .zIndex(2)
      .height('100%')
    }
  }

暖场视频播放器#

关键方法#

方法方法描述
VHWatchVodPlayer.initWebinarInfo初始化直播间信息
VHWatchVodPlayer.setVodPlayerListener设置播放器回调事件监听
VHWatchVodPlayer.startPlayWithRecordId开始播放
VHWatchVodPlayer.stopPlay停止播放
VHWatchVodPlayer.pausePlay暂停播放
VHWatchVodPlayer.resumePlay恢复播放
VHWatchVodPlayer.setSpeed设置当前播放器播放倍速
VHWatchVodPlayer.seek设置播放器播放位置
VHWatchVodPlayer.changeDefinition切换清晰度
VHWatchVodPlayer.setPlayerVolume设置播放音量
VHWatchVodPlayer.setPlayerScalingMode设置播放器视频画面填充模式
VHWatchVodPlayer.destroyPlayer销毁播放器
VHWatchVodPlayer.initCastPlay初始化投屏能力
VHWatchVodPlayer.startCastingPlay开始投屏
VHWatchVodPlayer.seekCasting设置投屏进度
VHWatchVodPlayer.stopCastingPlay结束投屏
VHWatchVodPlayer.initPipController初始化画中画
VHWatchVodPlayer.startPiP开启画中画
VHWatchVodPlayer.updatePipControlStatus更新画中画播放按键状态
VHWatchVodPlayer.stopPiP结束画中画
VHWatchVodPlayerCallback播放器事件回调

实例化播放器控制器#

类构造
代码示例

import { VHWatchVodPlayer} from "@vhall/vhall_live";

@Component
export struct VHWatchLivePlayerComponent {
  @State message: string = 'Hello World';
  /**
   * 播放器控制类
   * */
 public vodPlayer?: VHWatchVodPlayer = new VHWatchVodPlayer(this.getUIContext().getHostContext() as Context);
 ......
  }

构造点播播放器组件#

组件构造
@Component
export struct VHWatchVodPlayerView {
  /**
   * 组件状态更新回调
   */
  @Require public componentListener?: VHWatchVodPlayerCallback;
  /**
   * 播放器控制类
   * */
  @Require public vodPlayer?:VHWatchVodPlayer;
  /**
   * 控制是否扩展
   */
  @Prop  public is_expand: boolean = false;
  /**
   * @param enable_default_water_mask 是否使用默认水印
   * **/
  @Require enable_default_water_mask:boolean = false;
  /**
   * @param water 水印
   * **/
  @Require water: VHWatermarkConfig | null = null;
}
代码示例
   build() {
    Stack({ alignContent: Alignment.Center }) {
      // 播放器容器
      VHWatchVodPlayerView({
        componentListener: this,
        vodPlayer: this.vodPlayer,
        is_expand: this.is_expand,
        enable_default_water_mask: true,
        water: this.player_config?.water
      })
        .width('100%')
        .height('100%')
        .expandSafeArea(this.is_expand ? this.expandTypes : [], this.is_expand ? this.expandEdges : [])
        .backgroundColor(Color.Black)
        .align(Alignment.Center)
        .zIndex(playerZIndex.indexOf(PLAYER_INDEX))
    
    
     }
  }

初始化直播间信息#

接口 API
  public initWebinarInfo(webinarsInfo: VHWebinarData)
接口入参
参数名称是否必须示例备注
webinarsInfo是xx活动信息
代码示例
   aboutToAppear(): void {
    this.vodPlayer?.initWebinarInfo(this.webinars!);
  }

设置播放器回调事件监听#

接口 API
 public setLivePlayerListener(listener: VHWatchLivePlayerCallback) 
代码示例

@Component
export struct VHWatchVodPlayerComponent {

  public vodPlayer?: VHWatchVodPlayer = new VHWatchVodPlayer(this.getUIContext().getHostContext() as Context);
  @State public webinars: VHWebinarData | null = null;

  aboutToAppear(): void {
  //初始化播放器活动信息
    this.vodPlayer?.initWebinarInfo(this.webinars!);
    //是否支持画中画
    if (this.player_config?.basic?.picture_in_picture == 1) {
      this.vodPlayer?.initPipController(true);
    }
    this.vodPlayer?.setVodPlayerListener(this);
    this.vodPlayer?.setPlayerScalingMode(VHPlayerVideoScalingMode.VH_ASPECT_FILL);
    }
 }

开始播放#

接口 API
  public startPlayWithRecordId(paas_record_id:string,def:VHPlayDefinition)
接口入参
参数名称是否必须示例备注
paas_record_id是xx回放id,通过初始化接口获取到warmup_paas_record_id数组得到回放id,
def是xx清晰度
代码示例
 

 //组件初始化成功后播放暖场视频
 onPlayerViewInitCompleted(){
    if( this.currentPlayId.length > 0){
      this.vodPlayer?.startPlayWithRecordId(this.currentPlayId,this.player_config?.default_definition!);
      this.isPlayError = true;
    }
  }

停止播放#

接口 API
  public stopPlay() 
代码示例
    this.vodPlayer?.stopPlay();

暂停播放#

接口 API
  public pausePlay() 
代码示例
//控制暂停和恢复
if(this.is_playing){
  this.vodPlayer?.pausePlay();
  this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PAUSE);
}else{
  this.vodPlayer?.resumePlay();
  this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PLAY);
}

恢复播放#

接口 API
  public resumePlay() 
代码示例
//控制暂停和恢复
if(this.is_playing){
  this.vodPlayer?.pausePlay();
  this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PAUSE);
}else{
  this.vodPlayer?.resumePlay();
  this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PLAY);
}

设置当前播放器播放倍速#

接口 API
 public setSpeed(speed:VHVodSupportSpeed)
接口入参
参数名称是否必须示例备注
speed是xx倍速枚举 VHVodSupportSpeed
代码示例
//控制暂停和恢复
builder: SpeedPopup({
      onItemSelected: (item: popItemValueObj) => {
        if (this.is_start) {
          this.vodPlayer?.setSpeed(item.value as VHVodSupportSpeed)
          this.speedSetting = item.value as VHVodSupportSpeed;
        }
        this.speed = item.text;
        this.isSpeedShow = false;
      }
    })

恢复播放#

接口 API
  public resumePlay() 
代码示例
//控制暂停和恢复
if(this.is_playing){
  this.vodPlayer?.pausePlay();
  this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PAUSE);
}else{
  this.vodPlayer?.resumePlay();
  this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PLAY);
}

设置播放器播放位置#

接口 API
 public seek(currentTime:number)
接口入参
参数名称是否必须示例备注
currentTime是xx播放位置 (ms)
代码示例
//控制暂停和恢复
  this.vodPlayer?.seekCasting(this.currentTime);

切换清晰度#

接口 API
 public changeDefinition(def: VHPlayDefinition)
参数名称是否必须示例备注
def是xx清晰度
代码示例
//根据选择的清晰度进行播放
builder:definitionsPopup({onItemSelected: (item: popItemValueObj) => {
    if (this.is_start) {
      this.isLoading = true;
      this.vodPlayer?.changeDefinition(item.value as VHPlayDefinition)
      this.isPlayError = true;
    }
    this.playDefinition = item.text;
    this.isDefinition = false;
  }},this.playDefinitionList),

设置播放音量#

接口 API
 public setPlayerVolume(vol: number): number
参数名称是否必须示例备注
vol是xx范围:0.01 ~ 1.0
代码示例
//根据选择的清晰度进行播放
.onActionUpdate((event: GestureEvent | undefined) => {
  if (event && event.fingerList && event.fingerList[0]) {
    const touchY = event.fingerList[0].localY;
    const deltaY = touchY - touchStartY;
    // 移动距离占播放器高度的比例(deltaY取反是因为值的正负与滑动方向相反)
    const percent = (-deltaY / changeHeight);
    const width = changeWidth as number;
    if (touchStartX <= (width / 2)) {

    } else {
      let v = this.playerVol - (event.offsetY)/3/10;
      let newVol = this.playerVol + percent;
      // 严格限制在0-100范围内
      newVol = Math.max(0, Math.min(100, v));
      this.playerVol = newVol;
      this.isShowVol = true;
      this.vodPlayer?.setPlayerVolume(newVol/100);//设置音量
    }
    touchStartY = touchY;
  }
})

设置播放器视频画面填充模式#

接口 API
  public setPlayerScalingMode(mode: VHPlayerVideoScalingMode)
参数名称是否必须示例备注
mode是xxVHPlayerVideoScalingMode 图像拉伸,等比例缩放,平铺
代码示例
//根据选择的清晰度进行播放
aboutToAppear(): void {
    this.vodPlayer?.initWebinarInfo(this.webinars!);
    if(this.playerConfig?.basic?.picture_in_picture == 1){
      this.vodPlayer?.initPipController(true);
    }
    this.vodPlayer?.setLivePlayerListener(this);
    this.vodPlayer?.setPlayerScalingMode(VHPlayerVideoScalingMode.VH_ASPECT_FILL);
    }

销毁播放器#

接口 API
 public destroyPlayer()
代码示例
  aboutToDisappear(): void {
    this.barrageController.pause();
    this.barrageController.clearInScreen();
    this.vodPlayer?.destroyPlayer();
  }

初始化投屏能力#

接口 API
  public initCastPlay(source: VHCastMediaSource) 
代码示例
aboutToAppear(): void {
    this.vodPlayer?.initWebinarInfo(this.webinars!);
    this.vodPlayer?.setLivePlayerListener(this);
    this.vodPlayer?.setPlayerScalingMode(VHPlayerVideoScalingMode.VH_ASPECT_FILL);
   
    this.source = {
      title:this.webinars?.webinar?.subject!,
      name:'微吼SaaS',
      description:this.webinars?.webinar?.subject!,
      headImage:"https://cnstatic01.e.vhall.com/.....c1651.jpg"
    };
    //初始化投屏后,会创建媒体会话绑定播控服务。如果不使用投屏功能不要进行初始化。
    this.vodPlayer?.initCastPlay(this.source);
  });

开始投屏#

接口 API
  public startCastingPlay() 
代码示例
使用投播控件自动实现投屏

设置投屏进度#

接口 API
  public seekCasting(seekTime: number) 
参数名称是否必须示例备注
seekTime是xx播放进度,单位ms.
代码示例
 this.vodPlayer?.seekCasting(10001);

结束投屏#

接口 API
  public stopCastingPlay() 
代码示例
  .onClick(() => {
    this.vodPlayer?.stopCastingPlay();
    this.isCasting = false;
  })

初始化画中画#

接口 API
 public initPipController(autoStart:boolean,navId?:string)
参数名称是否必须示例备注
autoStart是xxboolean 退到后台是否自动开启画中画
navId否xx1、UIAbility使用Navigation管理页面,需要设置Navigation控件的id属性,并将该id设置给画中画控制器,确保还原场景下能够从画中画窗口恢复到原页面; 2、UIAbility使用Router管理页面时(画中画场景不推荐该导航方式),无需设置navigationId。注意:该场景下启动画中画后,不要进行页面切换,否则还原场景可能出现异常; 3、UIAbility只有单页面时,无需设置navigationId,还原场景下也能够从画中画窗口恢复到原页面
代码示例
  aboutToAppear(): void {
   //如果活动配置支持了画中画则进行配置
   this.vodPlayer?.initWebinarInfo(this.webinars!);
    if(this.playerConfig?.basic?.picture_in_picture == 1){
      this.vodPlayer?.initPipController(true);
    }
  }

开启画中画#

接口 API
 public startPiP()
代码示例
  this.vodPlayer?.startPiP();

更新画中画播放按键状态#

接口 API
  public updatePipControlStatus(status: VHPipControlPanelStatus)
参数名称是否必须示例备注
status是xxVHPipControlPanelStatus
代码示例
 if(this.is_playing){
    this.vodPlayer?.pausePlay();
     this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PAUSE);
}else{
   this.vodPlayer?.resumePlay();
   this.vodPlayer?.updatePipControlStatus(VHPipControlPanelStatus.VH_CONTROL_PLAY);
}

结束画中画#

接口 API
 public stopPiP()
代码示例
  this.vodPlayer?.stopPiP();

播放器事件回调#

接口 API
代码示例
  
  onPlayerViewInitCompleted() {
    this.vodPlayer?.startPlay(this.player_config?.default_definition!);
    this.isPlayError = true;
  }

  /**
   * 播放器播放失败事件
   */
  onPlayerError(error: VHErrorInfo) {
    if (error.code == VHConstants.VH_PLAY_CURRENT_DEF_FAILED) {
      //没有可用的清晰度,重新进行播放。
      this.vodPlayer?.startPlay(this.player_config?.default_definition!);
    } else if (error.code == VHConstants.VH_PLAY_STREAM_FAILED || error.code == VHConstants.VH_NETWORK_ERROR ||
      error.code == VHConstants.VH_CAN_NOT_FIND_HOST) {
      this.vodPlayer?.pausePlay();
      this.is_playing = false;
      this.isPlayError = true;
    }
    this.getUIContext().getPromptAction().showToast({
      message: error.code + error.message,
      duration: 4000,
      showMode: promptAction.ToastShowMode.DEFAULT,
      bottom: 80
    });
  }

  /**
   * 观看状态回调
   * @param player  播放器实例
   * @param state   状态类型 详见 VHPlayerStatus 的定义.
   */
  onStatusDidChange(state: VHPlayerState) {
    if (state == VHPlayerState.VH_PLAYER_PLAYING) {
      this.is_start = true;
      this.is_playing = true;
      this.isLoading = false;
      this.isPlayError = false;
    } else if (state == VHPlayerState.VH_PLAYER_PAUSE || state == VHPlayerState.VH_PLAYER_STOP ||
      state == VHPlayerState.VH_PLAYER_RELEASE) {
      this.is_playing = false;
    }
    if (state == VHPlayerState.VH_PLAYER_PREPARED) {
      this.isLoading = true;
      if (this.isPlayError) {
        //播放失败后重新播放监听VH_PLAYER_PREPARED事件,然后重置下播放进度
        this.vodPlayer?.seek(this.currentTime);
      }
    } else if (state == VHPlayerState.VH_PLAYER_BUFFERING_END) {
      this.isLoading = false;
    }
    this.playerState = state;
  }

  /**
   * 画中画状态
   * @param state: 画中画播放状态
   */
  onPipStatusChange(state: VHPlayerPipState) {

  }

  /**
   * 画中画控制中心播放状态
   * @param state: VHPlayerPipControlPanelStatus
   */
  onPipControlPanelStatusChange(state: VHPipControlPanelStatus) {
    if (state == VHPipControlPanelStatus.VH_CONTROL_PAUSE) {
      this.vodPlayer?.pausePlay();
    } else {
      this.vodPlayer?.resumePlay();
    }
  }

  /**
   * 播放器音量
   * @param volume :当前播放器音量值
   */
  onPlayerVolume(volume: number) {

  }

  /**
   * 当前房间支持的清晰度列表
   * @param definitions   支持的清晰度列表
   */
  onValidDefinitions(definitions: VHPlayDefinition[]) {
    let hasDef: boolean = false;
    this.definitions_list = [];
    this.playDefinitionList = [];
    definitions.forEach((item) => {
      //是否隐藏原画
      if (item == VHPlayDefinition.VH_ORIGIN && this.configList.live_hidden_same == 1) {
        return;
      }
      this.definitions_list.push(item);
      if (this.player_config?.default_definition == item) {
        hasDef = true;
      }
      this.resetPlayDef(item);
    })
    if (!hasDef && this.player_config && definitions.length > 0) {
      definitions.forEach((item) => {
        //如果没有默认清晰度,则重新选择一个清晰度
        if (item != VHPlayDefinition.VH_AUDIO && this.player_config) {
          this.resetPlayDef(item);
          this.player_config.default_definition = item as VHPlayDefinition;
          return;
        }
      })
    }
  }

  /**
   * 视频流播放成功后,回调视频流的宽髙。用户可根据视频流实际宽高,调整播放容器大小。
   * @param width   视频帧宽度
   * @param height  视频帧高度
   */
  onVideoFrameSize(width: number, height: number) {

  }

  /**
   * 投屏设备状体事件回调。
   * @param state. 0 设备已准备好可以播放。1:设备已断开
   */
  onCastPlayDeviceState(state: number) {
    this.isCasting = state == 0 ? true : false;
  }

  /**
   * 已连接的投屏设备。
   * @param state. 0 设备已准备好可以播放。1:设备已断开
   */
  onCastPlayDeviceConnected(device: VHCastPickerDevice) {
    this.castPickDevice = device.deviceName;
  }

  /**
   * 投屏事件回调。
   * @param state:VHCastPlayState
   */
  onCastPlayState(state: VHCastPickerState) {
    if (state == VHCastPickerState.VH_CAST_PICKER_STATE_PLAY) {
      this.is_start = true;
      this.is_playing = true;
    } else if (state == VHCastPickerState.VH_CAST_PICKER_STATE_PAUSE ||
      state == VHCastPickerState.VH_CAST_PICKER_STATE_STOP) {
      this.is_playing = false;
    }
  }

  /**
   * 投屏播放时长。
   * @param duration:number  播放总时长 ,单位ms
   */
  onCastPlayDuration(duration: number) {
    this.totalDuration = duration;
  }

  /**
   * 投屏播放当前位置。
   * @param position:number  播放当前进度 ,单位ms
   */
  onCastPlayPosition(position: number) {
    this.currentTime = position;
  }

  /**
   * 投屏操作失败。
   * @param state:VHCastPlayState。执行相关操作失败。包括开播、暂停、设置进度
   */
  onCastPlayError(state: VHCastPickerState) {
    this.getUIContext().getPromptAction().showToast({
      message: '投屏异常' + state.toString(),
      duration: 4000,
      showMode: promptAction.ToastShowMode.DEFAULT,
      bottom: 80
    });
  }

  /**
   * @description 监听资源播放资源的时长,单位为毫秒(ms),用于刷新进度条长度
   * @param duration  回放时长,单位为毫秒(ms)。
   */
  onVodTotalDuration(duration: number) {
    this.totalDuration = duration;
  }

  /**
   * @description 当前播放时长,单位为毫秒(ms),用于刷新进度条长度
   * @param currentDuration  当前播放时长,单位为毫秒(ms)。
   */
  onVodCurrentDuration(current: number) {
    this.currentTime = current;
    //定时每秒同步播放进度。用于同步显示实时字幕
    if (this.subtitleTimer == 0) {
      this.subtitleTimer = setInterval(() => {
        let msgData: EmitterMsgData;
        msgData = {
          type: MsgType.VOD_SUBTITLE_TIME,
          data: this.currentTime
        } as EmitterMsgData;
        EmitterUtil.send(msgData);
      }, 500)
    }
  }

  /**
   * @description 监听SeekTime,用于刷新进度条长度
   * @param duration  当前时长,单位为毫秒(ms)。
   */
  onVodSeekDuration(duration: number) {

  }

  /**
   * @description 监听倍速切换,表示切换倍速成功。
   * @param speed  当前倍速
   */
  onVodSpeedDone(speed: VHVodSupportSpeed) {

  }

暖场视频配置#

VHWarmup类型备注
warmup_paas_record_idstring[]暖场paas_record_id
warmup_img_urlstring暖场封面
warmup_player_typenumber1:单次播放 2:循环播放
advance_play_timenumber提前播放时间,单位秒. 预约或开播前展示
修改于 2025-11-20 06:24:45
上一页
开屏海报
下一页
观看直播
Built with