集成 SDK

本文为您介绍 VePlayer 的接入步骤。通过接入 VePlayer，您可以在网页上添加一个视频播放器。

引入依赖

VePlayer 支持以下 3 种引入依赖。

添加播放器容器

在需要展示播放器的页面添加播放器容器，例如，在 index.html 中加入以下代码。

<div id="video"></div>

实例化播放器

传入业务需要的参数，页面加载后，即可播放音视频资源。在点播场景下，实现视频播放的方式有两种。

• 传入播放器容器 ID 和播放地址 URL，即可实现视频播放。代码示例如下所示。

  const playerSdk = new VePlayer({
    id: 'video',
    url: 'xxx.mp4'
  });
  

• 也可以通过 Vid+PlayAuthToken 进行视频播放。详情请见 Vid 模式播放。

接入质量平台

完成实例化播放器后，为了能在视频点播控制台质量平台页面查询监控线上的播放质量，需要按播放质量上报一节所说明接入质量上报。这样基于 VePlayer 提供的精细化埋点和日志上报，即可体验完整的用户播放指标体系：

• 通过对播放数据的深度挖掘，实现 QoS、QoE、成本等质量数据监控、分析、诊断和告警，形成质量分析闭环。
• 同时提供点播用户级播放记录查询，精准定位单次播放记录，进行全链路问题诊断。

从而让您达成对 Web 播放情况的远程监控和数据统计分析的目的。

接入其他功能

接入质量平台后，您可参考以下文档，接入 VePlayer 的设置封面、画中画、预览缩略图、加密视频播放等功能：

• 基础功能
• 进阶功能
• API 参考