记录--vue中使用vue-video-player实现直播推流播放m3u8

这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助

1、安装 vue-video-player

npm install vue-video-player --save
npm install videojs-contrib-hls --save //播放直播
//在main.js中引入
// 引入播放器
import VideoPlayer from 'vue-video-player'
import 'vue-video-player/src/custom-theme.css'
import 'video.js/dist/video-js.css' 
import 'videojs-contrib-hls'
Vue.use(VideoPlayer)

2、页面中使用

在data中定义一个video

export default {
	data(){
		return {
			playerOptions: {
	        playbackRates: [0.5, 1.0, 1.5, 2.0], // 可选的播放速度
	        autoplay: true, // 如果为true,浏览器准备好时开始回放。
	        muted: false, // 默认情况下将会消除任何音频。
	        loop: false, // 是否视频一结束就重新开始。
	        preload: 'auto', // 建议浏览器在

也可直接写个 播放组件 根据自己的需求引入应用

本文转载于:

https://blog.csdn.net/qq_45966018/article/details/124605913

如果对您有所帮助，欢迎您点个关注，我会定时更新技术文档，大家一起讨论学习，一起进步。