vue使用video.js解决m3u8视频播放格式

1.在vue中安装下面这些插件

npm install  video.js --save
npm  install videojs-contrib-hls --save

2.页面中使用

<video
          id="sosVideo"
          class="video-js vjs-default-skin vjs-big-play-centered"
          controls
          preload="auto"
          style='width: 100%;height: auto'
          :poster="poster"
        >
        </video>

4.main.js引用video.js全局引用

import Video from 'video.js'
import 'video.js/dist/video-js.css'
Vue.prototype.$video = Video

4.方法里面写

that.$nextTick(() => {
							that.myVideo = that.$video('sosVideo', {
								bigPlayButton: true,
								textTrackDisplay: false,
								errorDisplay: false,
								controls: true,
								muted: false,
								hls: {
									withCredentials: true
								}
							})
							that.myVideo.src({
								src: res.data.hls,
								type: 'application/x-mpegURL'
							})
							that.myVideo.load()
							that.myVideo.play()
						})
					

5.离开页面销毁组件

if (this.myVideo) {
    this.myVideo.pause()
	this.myVideo.dispose()
}