Javascript JS-检测来自其他域的图像亮度

我在文档的

中加载了一幅图像，我想使用JS来确定图像的平均“亮度”（调整叠加元素的颜色以提高可见性）

这里的答案是：很好用…除了它不适用于跨源资源的事实。我需要确定亮度的图像可能来自任何域，我无法控制在服务器上设置必要的CORS头，以便与响应一起传回，以便JS轻松使用图像

---

有没有办法从外部域获取图像的亮度，而不必担心CORS？

不直接：不在CORS上加载的跨域图像（用<代码> SCORSORIGIN < /代码>属性）被认为是“污点”，并且在任何地方被绘制（例如在画布上）。也将被污染。您无法从污染的画布读取图像数据，这就是为什么链接答案中描述的方法（使用

getImageData

读取图像数据）无法工作的原因

其背后的原因与任何其他CORS受限资源相同：未经其他域的明确许可（通过使用CORS头），您不应该能够从其他域获取信息，因为远程域可能从未打算让其他域访问此类图像

例如，图像共享服务可能只允许登录用户访问私人图像；如果不存在此限制，任何具有此类图像URL的网站都可以作为登录用户请求该图像，然后读取图像，上传并在其自己的网站上发布，这肯定是一个隐私问题

---

您可以通过使用CORS代理解决此问题，CORS代理通过自动添加CORS头的服务器路由您的请求。您可以使用公共服务，例如（您只需添加

https://crossorigin.me/

在URL之前），或者，如果您不喜欢通过未知的第三方发送请求，您也可以运行自己的CORS代理。

谢谢-我以前见过这种CORS代理的想法，我真的不想走这条路，因为图像可能相当大，并且特定的代理有大小限制（我不想自己制作）-速度也是一个问题。我只是想知道是否有任何巧妙的解决方法来解决这个问题-或者也许有某种方法可以使用CSS混合模式根据背景均匀地更改某些元素的颜色（以增强可见性）@abagshaw正如我所指出的，你可以托管自己的CORS代理，但是如果你不愿意/不能使用它，那么除了使用代理之外，就没有可以编写脚本的解决方法。我也怀疑CSS中是否有类似的东西（但我绝对不是CSS专家，所以我不确定）。