Question

为什么我们在拥有img标签时没有获得access-control-allow-origin问题 src=urlOfdifferentDomain元素指的是不同的域

喜欢的情况：1

<img src="urlOfdifferentDomain" />

但是当我们做案例2时我们会得到同样的错误

//creating image element
a=new Image();
// image on load function
a.onload=function(){
}
// assigning src function
a.src=urlOfdifferentDomain

我只是想知道这两种方法之间的区别。我还将webserver中的csp img-src分配给self，然后在case 1中将图像从不同的域加载

Answer 1

案例1没问题，因为在HTML中使用图像不会将资源（从其他域）暴露给JavaScript，因此不会导致安全问题。

案例2将报告错误，因为使用Image对象DO会对某些操作（如Canvas编辑）带来安全风险，因为它会将资源从其他域公开给JavaScript。

更新：此错误是由浏览器安全检查引起的。 Web服务器不知道请求是来自html标记还是来自javascript调用，并且无论如何都将返回资源 - 您可以在浏览器中检查网络调试面板，并查看资源是否已下载状态为200。资源下载并暴露给JavaScript操作后。浏览器将检查资源上的JavaScript操作是否存在漏洞。如果是，如果服务器中未启用CORS，则将报告Access-Control-Allow-Origin错误。

图像加载上的access-control-allow-origin问题

1 个答案: