HTML页面跨域请求图片资源报错：Failed to load resource: the server responded with a status of 403 (Forbidden)

       笔者近日刚刚完成了一个Spring boot项目，首页 index.html 页面元素 引用了第三方服务器的图片链接，在本地测试环境输入 http://localhost 或者 http://127.0.0.1打开首页，图片显示正常，直接在浏览器输入图片路径也是正常显示的。

       但是项目打包发布到服务端后，在浏览器输入站点首页路径后，这个页面图片显示区域出现一个大大的空白框，于是查看浏览器控制台，发现报错：Failed to load resource: the server responded with a status of 403 (Forbidden)。

       经过查阅相关内容了解到，这是服务器防止盗链的策略引起的。一般来说，从服务器站点下载图片资源，会产生相关的流量费用（比如阿里云的oss服务器），所以需要一些方法来防止类似的盗链情况的发生，背后的原理就是利用 http 请求的 referrer 头信息，headers 中的 referer 表示你是从哪个站点（域名）来到图片资源所在的服务器的，我们请求页面的时候，也通过抓包包软件可以看到这个 referrer 头信息的具体内容，一般来说就是你自己站点的域名。

       在服务器端可以获取的 referrer 的内容，并根据需要对其进行处理，比如 referrer 内容为空或者在白名单列表里就不执行防盗链的相关处理，反之则提示403 Forbidden，目前有一个简单的解决这个问题的方法：在我们的HTML页面添加meta属性：

       这样处理后，我们的页面在请求第三方服务器的图片资源时，header 的 referrer 头信息就为空了。如果第三方站点允许 referrer 为空的资源请求，那我们就能够正常请求到图片资源了。

参考：referrer策略和meta标签的问题