img 标签如何通过 cors 标头获取内容答案

【问题标题】：How img tag gets content over cors headersimg 标签如何通过 cors 标头获取内容
【发布时间】：2018-06-07 06:38:13
【问题描述】：

为什么，当我使用 fetch 从禁用响应 CORS 标头的服务器加载数据时，我预计会收到错误：
Failed to load http://www.imgworlds.com/wp-content/uploads/2015/12/18-CONTACTUS-HEADER.jpg: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63343' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
但是会显示来自 img 标签的图像

<script>
    fetch('http://www.imgworlds.com/wp-content/uploads/2015/12/18-CONTACTUS-HEADER.jpg').then(console.log);
</script>
<img src="http://www.imgworlds.com/wp-content/uploads/2015/12/18-CONTACTUS-HEADER.jpg">

【问题讨论】：

标签： html http http-headers cors

【解决方案1】：

跨域共享标准不包括img 标签，但 XHR/fetch 请求和某些情况下包括将图像绘制到画布上。

更多信息： https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#What_requests_use_CORS

【讨论】：