问题描述
canvas.toDataURL通常会生成哪些安全线程？我们必须采取什么措施来安全地使用它并使其无线程进入我们的网站？
What security threads would canvas.toDataURL generate in general? What measures we have to take to make use of it secure and thread free to our website?
在以下链接中，有关于.toDataURL引发的安全错误的讨论，如果图像不在本地托管，但是为什么呢？
In the following links there are discussions around security error that .toDataURL raises if the image is not hosted locally, but why is that?
推荐答案
注意同源策略。本质上，这是浏览器采用的一种安全机制，可确保只允许源于用户访问的同一站点的脚本不受限制地运行并访问DOM。
You may be aware of the same-origin policy. In essence, it's a security mechanism employed by browsers to make sure that only scripts that originate from the same site that the user is visiting are allowed to run without restrictions and access the DOM.
您可以将脚本伪装成图像，例如，可以将脚本中的每4个字符组存储为一个像素（每个通道一个字节），然后读取该图像的像素以重建脚本。
You could disguise a script as an image, for example you could store each group of 4 characters in the script in a pixel (one byte per channel), then read the pixels of that image to reconstruct the script.
这就是为什么同源规则也适用于图像的原因：如果将来自其他域的图像绘制到网页上的画布中，则只能做些限制如果您已经在画布上绘制了跨域图像，请在画布上绘制。例如，您无法检查其像素。
This is why the same-origin policy applies to images too: if you draw images from a different domain into a canvas on your web page, there is a limit to what you can do with your canvas if you have drawn cross-origin images into it. For example, you can't inspect its pixels.
现在假设您可以使用canvas.toDataURL（）从跨域画布生成数据url。当您的浏览器知道您的画布包含跨域内容时，数据URL就是：URL。因此，无法肯定地知道它以某种方式源自不同的域，并且有可能被用来绕过整个同源的事物。例如，您可以创建一个新的img并将数据URL用作其src。
Now imagine that you could use canvas.toDataURL() to generate a data url from your cross-origin canvas. While your browser knows that your canvas contains cross-origin content, a data URL is just that: a URL. So there is no sure way of knowing that it has originated from a different domain in some way, and it could be potentially used to bypass the whole same-origin thing. As an example, you could create a new img and use the data URL as its src.
这篇关于使用canvas.toDataURL有哪些安全问题？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！