vue项目中播放M3u8格式的视频,最终选择了Dplayer这款播放器,DPlayer是一个可爱的HTML5 弹幕视频播放器,可以帮助人们轻松地构建视频和弹幕。
Dplayer帮助文档/官网
因为Dplayer 文档中有默认的弹幕库,你也可以自己搭建弹幕服务器,貌似是node 环境,Dplayer中有配置参数,可以提交代码和获取代码,大致是
danmaku: {
id: '9E2E3368B56CDBB4',
api: 'https://api.prprpr.me/dplayer/',
token: 'tokendemo',
maximum: 1000,
addition: ['https://api.prprpr.me/dplayer/v3/bilibili?aid=4157142'],
user: 'DIYgod',
bottom: '15%',
unlimited: true,
},
因为dplayer的弹幕默认在接口后面添加了 /v3,比如说项目的接口为https://xxx/xxx/xxx?id=1,但是经过dplayer发送的请求就成了https://xxx/xxx/xxx/v3?id=1,这样我们根本就无法获取到数据了。
解决方案
- 1 首先,vue项目中不要用 npm install dplayer
- 2 把dplayer下载到项目中,形成一个dplayer的文件
- 3 修改dplayer中的DPlayer.min.js
把 文件内所有带/v3 的代码统统删除,
ok—大功告成![请求](https://i-blog.csdnimg.cn/blog_migrate/b09be217c739aba3c2acbb0f4fcc15a0.png)
![响应](https://i-blog.csdnimg.cn/blog_migrate/fb66bbb2ce12e177885385da9079080c.png)