videojs-contrib-hls版本搭配video

Video.js-contrib-hls是一个用于Video.js库的插件，它允许视频播放器支持HLS（HTTP Live Streaming）流，常用于在线直播或点播内容。Video.js是一个流行的JavaScript库，用于创建交互式的HTML5视频播放器。当你想要在Video.js上播放HLS内容时，可以安装这个插件并将其与Video.js的核心库结合使用。

首先，你需要在项目中引入Video.js库以及video-js-contrib-hls模块：

<!-- 引入Video.js核心库 -->
<link href="https://cdn.jsdelivr.net/npm/video.js@7/dist/video-js.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/video.js@7/dist/video.min.js"></script>

<!-- 引入HLS插件 -->
<script src="https://cdn.jsdelivr.net/npm/videojs-contrib-hls@latest/dist/videojs-contrib-hls.min.js"></script>

然后，在JavaScript中初始化Video.js实例，并指定HLS源：

// 初始化Video.js播放器
var player = videojs('my-video', {
  plugins: {
    hls: {
      xhrSetup: function(xhr) {
        xhr.withCredentials = true; // 如果需要跨域请求，则添加这行代码
      }
    }
  },
  sources: [{
    type: 'application/x-mpegURL',
    src: 'your-hls-stream.m3u8' // 替换为你的HLS流地址
  }]
});