视频src youtube插件MEDIA_ERR_SRC_NOT_SUPPORTED动态更新src

Question

因此，我创建了一个简单的视频播放列表，它与我主持的视频非常好，但是当我加载youtube视频src时，我得到了上面的错误。Onclick我正在从数据攻击中获取url，并使用video.js src函数加载新视频。

视频设置：

<video id="fatigue-1" 
class="video-js vjs-default-skin"
controls 
preload="auto" 
width="100%" 
height="100%" 
data-setup='{"techOrder":["youtube", "html5"], "src": "https://www.youtube.com/watch?v=SS4F1U5FuNM"}' >
</video>

更新src功能：

updateSrc: function(e) {
    var videoURL = $(e.currentTarget).attr("data-url"),
        videoType = $(e.currentTarget).attr("data-type"),
        videoID = this.$el.find(".video-js").attr("id"),
        videoPlayer = videojs(videoID);

    videoPlayer.src({type: videoType, src: videoURL});
}

我不确定youtube插件是否与src函数一起工作，因为当我的方法运行时，它会更新数据设置之外的src，并且在docs中声明应该在其中定义url。另外，视频id的更改显示html5 api正在被使用，而不是youtube api。见下文：

<video id="fatigue-1_html5_api"
class="vjs-tech"
preload="auto"
data-setup="{"techOrder":["youtube", "html5";], "src": "https://www.youtube.com/watch?v=SS4F1U5FuNM";}"
src="//www.youtube-nocookie.com/embed/yP41vpFOKVA">
</video>

想知道是否有人有用视频动态加载youtube视频的例子，或者看到我犯了什么明显的错误？

Answer 1

在html中：-

    <video
    id="my-player"
    class="video-js vjs-default-skin"
    controls
    preload="auto"
    width="1260"
   >
    </video> 

• 不要提供任何联机数据设置或src。

在js中；-

const player= videojs('my-player',{
            preload:'auto',
            controls:true,
            autoplay:true,
            techOrder:['html5','youtube']
    })
    player.src({type:'video/youtube',src:videoUrl})
    
    player.load();
    player.play();