canvas 转 base64 那些坑

今天在实现项目功能的时候遇到了一个问题，基本功能是想把video视频的第一帧生成封面图，但是在使用canvas.toDataURL("image/png"),浏览器总是报错 Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.

经过多方查阅资料，发现是资源跨域的问题引起的（视频与页面不在一个域名下），所以在引用视频资源之前需要打开跨域资源允许权限crossOrigin="anonymous"，如下

<video crossOrigin="anonymous" id="video" controls="controls" src="">

</video>

一定要在引用资源之前才可以。