vue-video-player 播放加截图踩坑的解决方法随笔

this.$nextTick(() => {
        let video = document.getElementsByClassName("vjs-tech")[0];
        let canvas = document.createElement("canvas");
        let img = new Image();
        // img.crossOrigin = "anonymous"; //原先以为是这个问题跨域
        let w = window.innerWidth;
        let h = (window.innerWidth / 16) * 9;
        canvas.width = w;
        canvas.height = h;
        console.log(canvas);
        const ctx = canvas.getContext("2d");
        ctx.drawImage(video, 0, 0, w, h);
        this.previewImg = canvas.toDataURL("image/png");
        img.src = this.previewImg;
      });
//最终解决方案,video跨域而不是图片
mounted(){
    let video = document.getElementsByClassName("vjs-tech")[0];
    video.setAttribute('crossorigin', 'Anonymous')
  },

解决方法参考:https://blog.csdn.net/weixin_43341974/article/details/120768069?utm_medium=distribute.pc_relevant.none-task-blog-2defaultbaidujs_utm_term~default-8-120768069-blog-120742980.pc_relevant_paycolumn_v3&spm=1001.2101.3001.4242.5&utm_relevant_index=11


版权声明:本文为qq_42265650原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。