在内部网站上访问外部图片URL时发生403错误

Question

我一直在使用此内部Web应用程序，该应用程序允许用户单击按钮以查看图像。非常简单。

<img id="swatchimage" width="600" height="600" src="" />

图像需要从外部网站链接。做到这一点的javascript片段：

$("#swatchimage").attr("src", fileURL);

其中一个网址如下所示：

如果您尝试在浏览器中访问上面的图像，它将正常工作。 从内部应用程序（IP：192.168.110.15）访问它时，服务器将返回403错误。

在主网站中使用了相同的文件，所以我不认为这与热链接保护有关（我也尝试将其禁用，无济于事）。

链接此类资源时，我是否不了解某些限制？

Answer 1

我认为我发现了问题：

服务器（cdn.palmcentre.co.uk）没有在响应中发送Access-Control-Allow-Origin标头，因此您不能使用JavaScript来获取它。

但是，这不是403。这是我收到的错误的屏幕截图：

此外，您要尝试的操作是不获取图像，而是修改src元素的<image>属性，应该允许。< / p>

这使我认为您收到的错误是因为jQuery试图获取图像而失败，但是我不确定。

尝试执行以下操作：

document.getElementById("#swatchimage").src = fileURL;

Answer 2

似乎我找到了解决方案。

这确实令人困惑，因为我知道CORS不会在这里发挥作用。它只是从HTML标签请求的另一个图像URL。因此，它不应该以这种方式表现。

尽管我已经收到了帮助，但我还是很感激，但实际上，该问题实际上是一个热链接保护措施。

但这不是来自服务器本身或脚本，而是来自CloudFlare缓存本身。