有没有办法绕过画布中的跨域图像问题？

Question

当我尝试在从其他域导入的图像上使用canvas.toDataURL("image/jpeg");时，出现安全性错误。有没有解决这个问题的方法？

Answer 1

当您控制要从中加载映像的服务器时，您可以修改其跨源资源共享（CORS）设置以将您的域声明为受信任。有关详细信息，请参阅其使用的Web服务器软件手册和Serverfault。

当您不控制服务器时，可能的解决方法是让您自己的网络服务器从其他服务器请求图像，然后将其提供给客户端。先决条件是：

1. 某种服务器端编程技术（PHP，ASP，JSP，node.js，RoR，Django，Perl或任何你喜欢的）
2. 您的服务器必须有权访问该图像（这是跨域保护存在的原因：如果没有它，网站可以提供他们无法访问但他们的访问者可以访问的图像。当用户仍然拥有时他们的example.com登录cookie设置，任何其他网站上的javascript可以让他们请求https://example.com/private/photos/me_naked_01.jpg，将其绘制到画布，获取其dataUrl并使用XmlHttpRequest上传它。

此外，如果意味着您反复从同一服务器请求相同的图像，则不应在未经许可的情况下执行此操作。管理员会注意到所有来自您的网络服务器的异常请求，并决定阻止它。

当所有其他方法都失败时，您可以使用旧式方法，并允许您的用户上传自己的图片。