m3u8格式视屏播放

参考： https://www.jianshu.com/p/00e5f62829ca

<template>


   <div class="user" style="width:600px;height:600px">
      <!-- 播放m3u8视频 -->
      <video-player
        class="video-player vjs-custom-skin"
        :playsinline="true"
        :options="videoOption">
      </video-player>
    </div>

</template>

<script>
 
import "videojs-contrib-hls"
const defaultFormParam = {
 
};

export default {
  
  data() {
    return {
      videoOption:{
                live: false,
                preload: "auto",
                autoplay: true,
                language: "zh-CN",
                aspectRatio: "16:8",
                fluid: true,
                sources: [
                    {
                        src: 'http://101.39.229.167:83/openUrl/OI3u1vW/live.m3u8' //url地址
                    }
                ],
                notSupportedMessage: "此视频暂无法播放，请稍后再试", //允许覆盖Video.js无法播放媒体源时显示的默认信息。
                controlBar: {
                    timeDivider: false,
                    durationDisplay: false,
                    remainingTimeDisplay: false,
                    fullscreenToggle: true //全屏按钮
                },
                flash: {
                    hls: {
                        withCredentials: false
                    }
                }
      }
                
    }
  },
  filters: {

  },
  created() {
    
      
  },
  watch: {
    
  },
  methods: {
   
  }
};
</script>