vue拉流，拉取网站的直播源无法显示

我想做一个可以播放直播源的网站

从一个国外的网站获取到的.m3u8直播地址，网站地址：https://www.skylinewebcams.com/

在potplayer成功播放

在我本地播放时候只有该网站logo

我的源代码，地址通过父组件传进即播放

import {Component, Vue, Prop, Watch} from 'vue-property-decorator'
import Hls from "hls.js";
import VueDPlayer from "vue-dplayer";
import "vue-dplayer/dist/vue-dplayer.css";
import Dplayer from 'dplayer'



@Component({
  components: {
    "d-player": VueDPlayer,
  }
})
export default class TimeVideo extends Vue {
  public dp = {}
  @Prop({default: ''})
  public videoSrc !: string
  @Watch('videoSrc')
  public updateSrc(){
    console.log('good')
    this.videoLoad()
  }
  public videoLoad(){
    this.dp = new Dplayer({
      //播放器的一些参数
      container: document.getElementById('dplayer'),
      autoplay: true, //是否自动播放
      live:true,
      theme: '#FADFA3', //主题色
      lang: 'zh-cn',
      screenshot: false,//是否开启截图
      hotkey: true,//是否开启热键
      preload: 'auto',//视频是否预加载
      volume: 0.7,//默认音量
      mutex: true,//阻止多个播放器同时播放，当前播放器播放时暂停其他播放器
      video: {
        url: this.videoSrc, //视频地址
        // type: 'hls'
        type: 'customHls',
        customType: {
          customHls: function(video: HTMLMediaElement, player: any) {
            const hls = new Hls()  //实例化Hls  用于解析m3u8
            hls.loadSource(video.src)
            hls.attachMedia(video)
          }
        }
      }
    });
  }

我从直播中国拿到的直播地址是可以播放的：

求解答！

请求的时候是不是得把cookie带上？