沃梦达 / IT编程 / 前端开发 / 正文

使用Referrer Policy解决第三方平台的照片在https站点无法打开的问题

在https站点中使用微信公众平台的二维码时,提示此图片来自xxx,未经允许不可使用。遇到这样的问题应该如何解决呢? 先说解决方案,在img标签中添加referrerpolicy属性值为no-referrer img src="xxx.jpg?imageView2/0/w/818" referrerpolicy="no-referrer" / Referrer-Polic

 在https站点中使用微信公众平台的二维码时,提示此图片来自xxx,未经允许不可使用。遇到这样的问题应该如何解决呢?
先说解决方案,在img标签中添加referrerpolicy属性值为no-referrer
<img src="xxx.jpg?imageView2/0/w/818" referrerpolicy="no-referrer" />
Referrer-Policy
当用户在浏览器上点击一个链接时,会产生一个 HTTP 请求,用于获取新的页面内容,而在该请求的报头中,会包含一个 Referrer,用以指定该请求是从哪个页面跳转页来的,常被用于分析用户来源等信息。
// 整个 Referer 首部会被移除。访问来源信息不随着请求一起发送
Referrer-Policy: no-referrer
// 在没有指定任何策略的情况下用户代理的默认行为
Referrer-Policy: no-referrer-when-downgrade
// 在任何情况下,仅发送文件的源作为引用地址
Referrer-Policy: origin
// 对于同源的请求,会发送完整的URL作为引用地址,但是对于非同源请求仅发送文件的源。
Referrer-Policy: origin-when-cross-origin
// 对于同源的请求会发送引用地址,但是对于非同源请求则不发送引用地址信息
Referrer-Policy: same-origin
// 在同等安全级别的情况下,发送文件的源作为引用地址(HTTPS->HTTPS),但是在降级的情况下不会发送 (HTTPS->HTTP)
Referrer-Policy: strict-origin
// 对于同源的请求,会发送完整的URL作为引用地址;在同等安全级别的情况下,发送文件的源作为引用地址(HTTPS->HTTPS);在降级的情况下不发送此首部 (HTTPS->HTTP)
Referrer-Policy: strict-origin-when-cross-origin
// 无论是同源请求还是非同源请求,都发送完整的 URL(移除参数信息之后)作为引用地址。
Referrer-Policy: unsafe-url

使用方式

1、Request Header中直接设置Referrer-Policy
Referrer-Policy: no-referrer;
2、在HTML文件中通过meta标签指定
<meta name="referrer" content="no-referrer" />
3、在HTML标签上使用referrerpolicy属性设置
a 和 link 标签可以通过属性 rel 指定 noreferrer,仅对当前链接有效;
a、area、link、iframe 和 img 还可以通过 referrerpolicy 指定仅针对当前链接的设置
<a href="http://dysong.com" rel="no-referrer|origin|...">xxx</a>
<img src="xxx.jpg?imageView2/0/w/818" referrerpolicy="no-referrer|origin|..." />

本文标题为:使用Referrer Policy解决第三方平台的照片在https站点无法打开的问题