referer的写法是错的,正确的是referrer。大略是晚期http标准的拼写错误,而后为了放弃向下兼容,就一误再误了。
一、九种policy
enum ReferrerPolicy {
"",
"no-referrer",
"no-referrer-when-downgrade",
"same-origin",
"origin",
"strict-origin",
"origin-when-cross-origin",
"strict-origin-when-cross-origin",
"unsafe-url"
};
1 no-referrer
示意http申请的申请头没有referer字段
2 no-referrer-when-downgrade(默认值)
如果没指定其余policy,则这个就是浏览器的默认值。即以后的referer就是以后页面的地址(不包含锚点#)。
如果存在降级的状况,则referer不会被发送,也就是申请头没有referer字段,比方https->http的状况。
3 same-origin
如果申请是同源,即没有跨域,则referer字段会被发送。
如果申请存在跨域,则referer字段不会被发送。
4 origin
不论是否存在跨域或者降级的状况,referer字段都会被发送,但不会带上门路等信息,只有域名和端口。
比方页面地址是http://localhost:3000/referer.html,则referer则是http://localhost:3000/
5 strict-origin
在policy=origin的要求内,减少了在降级(https->http)的状况下,referer不会被发送。
6 origin-when-cross-origin
如果是同源的申请,则referer字段都会被发送,且referer的值是以后页面的地址(http://localhost:3000/referer.html)。
如果是跨域的申请,referer也会被发送,但此时referer的值只有域名+端口(http://localhost:3000/),也就是跟origin一样。
7 strict-origin-when-cross-origin
在policy=origin-when-cross-origin的要求内,减少了在降级(https->http)的状况下,referer不会被发送。
8 unsafe-url
不论是否同源或跨域,referer都会被发送。
9 空字符串
如果referer是空字符串,则会依据设定的算法回退到默认值,即no-referrer-when-downgrade
详情可参考:https://w3c.github.io/webapps...
二、referer什么时候不发送
在浏览器地址栏,间接输出或者点击标签的时候,referer就不会被发送。其余形式都会发送。
比方加载页面其余资源,如js,css和img等资源,又或者form表单,或者点击标签。
可通过js来获取referer的值:document.referrer。
但想通过js来扭转http申请头的referer是不行的,尽管能扭转document.referrer的值,但申请头的referer字段仍然不会被扭转。
delete window.document.referrer;
window.document.__defineGetter__('referrer', function () {
return "http://referer.com";
});
console.log(window.document.referrer) // http://referer.com
// 须要留神:此时http申请头的referer是没有被扭转的
三、哪些html标签可设置referer的policy
1 meta
可通过meta来设置下面提到的九种policy
如:<meta name="referrer" content="no-referrer">
2 a
可通过ref属性来设置。
如:xxx
3 img
可通过referrerPolicy属性来设置,如:
4 iframe
可通过referrerPolicy属性来设置,如:<iframe src="http://xxx.com" referrerPolicy="no-referrer"></iframe>
下面几种形式,meta是网站级别的,相当于父级,一旦设置,html页面下的a和img等都会继承referer策略。
但可通过独自设置a和img等来实现不同的referer策略。
网上说貌似form表单也能够设置referer,但看了下w3c文档,貌似没有。
而link标签的referrerpolicy属性则属于试验阶段的API。referer
的写法是错的,正确的是referrer
。大略是晚期http标准的拼写错误,而后为了放弃向下兼容,就一误再误了。
一、九种policy
enum ReferrerPolicy { "", "no-referrer", "no-referrer-when-downgrade", "same-origin", "origin", "strict-origin", "origin-when-cross-origin", "strict-origin-when-cross-origin", "unsafe-url"};
1 no-referrer
示意http
申请的申请头没有referer
字段
2 no-referrer-when-downgrade(默认值)
如果没指定其余policy
,则这个就是浏览器的默认值。即以后的referer
就是以后页面的地址(不包含锚点#)。
如果存在降级的状况,则referer
不会被发送,也就是申请头没有referer
字段,比方https->http
的状况。
3 same-origin
如果申请是同源,即没有跨域,则referer
字段会被发送。
如果申请存在跨域,则referer
字段不会被发送。
4 origin
不论是否存在跨域或者降级的状况,referer
字段都会被发送,但不会带上门路等信息,只有域名和端口。
比方页面地址是http://localhost:3000/referer.html
,则referer
则是http://localhost:3000/
5 strict-origin
在policy=origin
的要求内,减少了在降级(https->http
)的状况下,referer
不会被发送。
6 origin-when-cross-origin
如果是同源的申请,则referer
字段都会被发送,且referer
的值是以后页面的地址(http://localhost:3000/referer.html
)。
如果是跨域的申请,referer
也会被发送,但此时referer
的值只有域名+端口(http://localhost:3000/
),也就是跟origin
一样。
7 strict-origin-when-cross-origin
在policy=origin-when-cross-origin
的要求内,减少了在降级(https->http
)的状况下,referer
不会被发送。
8 unsafe-url
不论是否同源或跨域,referer
都会被发送。
9 空字符串
如果referer
是空字符串,则会依据设定的算法回退到默认值,即no-referrer-when-downgrade
详情可参考:https://w3c.github.io/webappsec-referrer-policy/
二、referer什么时候不发送
在浏览器地址栏,间接输出或者点击标签的时候,referer
就不会被发送。其余形式都会发送。
比方加载页面其余资源,如js
,css
和img
等资源,又或者form
表单,或者点击<a>
标签。
可通过js来获取referer
的值:document.referrer
。
但想通过js
来扭转http
申请头的referer
是不行的,尽管能扭转document.referrer
的值,但申请头的referer
字段仍然不会被扭转。
delete window.document.referrer;window.document.__defineGetter__('referrer', function () { return "http://referer.com";});console.log(window.document.referrer) // http://referer.com// 须要留神:此时http申请头的referer是没有被扭转的
三、哪些html标签可设置referer的policy
1 meta
可通过meta
来设置下面提到的九种policy
如:<meta name="referrer" content="no-referrer">
2 a
可通过ref
属性来设置。
如:<a rel="noreferrer" href="http://xxx.html">xxx</a>
3 img
可通过referrerPolicy
属性来设置,如:<img src="http://xx.png" referrerPolicy="no-refereer">
4 iframe
可通过referrerPolicy
属性来设置,如:<iframe src="http://xxx.com" referrerPolicy="no-referrer"></iframe>
下面几种形式,meta
是网站级别的,相当于父级,一旦设置,html
页面下的a
和img
等都会继承referer
策略。
但可通过独自设置a
和img
等来实现不同的referer
策略。
网上说貌似form
表单也能够设置referer
,但看了下w3c文档,貌似没有。
而link标签的referrerpolicy属性则属于试验阶段的API。