騰訊云文檔：
https://cloud.tencent.com/document/product/881/20207

• Step1. 引入初始化腳本

nuxt.config.js 引入TcPlayer JS庫

    script: [
      {
        src:
          '//imgcache.qq.com/open/qcloud/video/vcplayer/TcPlayer-2.3.2.js',
      },
    ],

• Step2. 在 HTML 中放置容器

 <div class="v_wra"><div id="id_test_video" style="width:100%; height:10rem;"></div></div>

• Step3. 對(duì)接視頻播放

var player = new TcPlayer("id_test_video", {
          "m3u8": this.liveInfo.m3u8,
          "flv": this.liveInfo.flv,
          "autoplay": true,
          "x5_playsinline": true, //不加這個(gè)的話，部分Android點(diǎn)擊視頻會(huì)全屏播放
          // "live": true, //直播模式，Android點(diǎn)擊視頻會(huì)全屏播放
          "volume": "1",
          "poster": "/images/poster-1.jpg",
          "width": "1280", //視頻的顯示寬度，請(qǐng)盡量使用視頻分辨率寬度
          "height": "640" //視頻的顯示高度，請(qǐng)盡量使用視頻分辨率高度
});

記得加上css自適應(yīng)

<style>
  .vcp-player,
  .vcp-player video {
    width: 100%!important;
    height: 10rem!important;
  }
</style>

vue中也嘗試同樣實(shí)現(xiàn)，不過最后頁面會(huì)報(bào)錯(cuò)TcPlayer not defined. 就算了吧。