### VePlayer

[火山引擎视频云](https://www.volcengine.com/)Web播放器SDK，自动适配PC和H5场景，支持MP4、HLS、FLV、DASH等多种格式的点播和直播，结合视频云具有播放质量日志上报、加密播放等功能。

### 引入依赖
通过包管理工具将 SDK 的依赖安装到项目中。
```bash
npm install @volcengine/veplayer --save
```
在项目中引入 VePlayer 和样式文件。
```javascript
import VePlayer from '@volcengine/veplayer';
import '@volcengine/veplayer/index.min.css';
```

### 添加播放容器
在需要展示播放器的页面添加播放器容器，例如，在 index.html 中加入以下代码。
```javascript
<div id="video"></div>
```
### 播放器实例化
在获取到视频地址后，实例化播放器。

#### 点播
```javascript
const player = new VePlayer({
    id: 'video', // 视频容器dom的id
    url: "https://demo.vod.com/xxx.mp4", // 视频地址
    vodLogOpts: {
        vtype: 'MP4', // 视频格式，HLS协议的视频请传入HLS
        tag: '普通视频', // 业务标签，用于区分业务中不同的场景，方便后续进行多维度分析
        line_app_id: 348293, // 【必选】该值为 int 类型，接入视频点播的SDK应用id，可以从点播控制台-点播SDK-应用管理获取
        line_user_id: 'XXX' // 用户 id， String 或者 int 类型, 不传入将是一个根据用户浏览器随机生成的值
    }
});
```
点播功能的详细说明参考[火山引擎-视频点播-Web 点播SDK](https://www.volcengine.com/docs/4/127897)

#### 直播
```javascript
const playerSdk = new VePlayer({
  id: 'video',
  isLive: true,
  url: '//livepull.example.com/appname/streamname.flv'
});
```
直播功能的详细说明参考[火山引擎-视频直播-Web SDK-拉流SDK](https://www.volcengine.com/docs/6469/127525)
