从视频引发创建的画布在保存时"Tainted canvases may not be exported."错误

Question

我正在使用此示例从HTML5视频创建快照。视频托管在我无法控制的第三方服务器上。

所以我想保存图像，但由于安全原因toDataURL失败了。

这是错误：Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.

我想图像有一个解决方案。 img.crossOrigin = "Anonymous"类似的东西。这里和这里。

我试过videoDomElm.crossOrigin = "Anonymous"，但没有运气。

视频有什么解决方案吗？

提前谢谢。

Answer 1

crossOrigin='anonymous'只是满足跨域安全要求的解决方案的一半。它会导致浏览器读取响应标头，并且如果标头允许跨源访问内容，则不会污染画布。

解决方案的另一半是将服务器配置为在其响应标头中发送适当的跨源权限。如果没有将服务器配置为允许跨源访问，画布仍将受到污染。

满足跨源安全性的唯一方法是：

1. 让视频与您的网页来自同一网域。

2. 将视频服务器配置为在其标头中发送适当的跨源访问。

没有解决方法 - 您必须满足安全限制。