video视频播放截图, 跨域问题

“SecurityError: Failed to execute ‘toDataURL’ on ‘HTMLCanvasElement’: Tainted canvases may not be exported.”
翻译: 执行“toDataURL”：可能无法导出受污染的画布

这就是出现跨域问题了, 在video标签加上crossOrigin="Anonymous"就ok了

<!-- html -->
<video id="videoPlayer"
       controls="controls"
       crossOrigin="Anonymous">
   <source src="http://192.168.0.70:8909/video/03/1504633439555.mp4"
           type="video/mp4" />
   <!-- <source src="../assets/测试视频.mp4"
                type="video/mp4" /> -->
</video>

// js
const canvas = document.createElement('canvas') //  创建canvas 用来截图
      let video = document.getElementById('videoPlayer')
      canvas.getContext('2d').drawImage(video, 0, 0, video.clientWidth, video.clientHeight)
      let b64 = canvas.toDataURL('image/png')
      console.log('b64', b64) // 转换后的base64