设为首页收藏本站
天天打卡

 找回密码
 立即注册
搜索
查看: 79|回复: 10

meta标签name="referrer"属性简介和用法小结

[复制链接]

1

主题

49

回帖

117

积分

注册会员

积分
117
发表于 2024-4-20 08:07:19 | 显示全部楼层 |阅读模式
目录

HTML<meta>标签name="referrer"属性主要用于控制网页发送给服务器的referrer信息,可以告诉服务器端用户是从哪个页面来到当前网页的。

什么是referrer?

referrer有“引用页面”或“来源页面”的意思,用来指定当前页面是从哪个页面跳转过来的,也就是说HTTP请求报头中的referrer包含了跳转至当前页面的上一个页面的url地址;
比如,你点击A页面中链接到B页面的URL地址,当你从浏览器进入B页面时,会向服务器发送请求,在这个请求的报头中会带上一个referrer,包含了A页面的URL地址;

referrer的作用

referrer可以告诉你用户是从哪个页面url地址过来的,这样就可以用来统计用户的来源,还可以用于分析用户的兴趣爱好、收集日志、优化缓存等等。
如果禁止referrer,可以防止盗链,或也可以绕过防盗链,也能防范一些攻击。

referrer的隐患

如果网页中,由于涉及隐私和安全问题,防止 referrer 泄漏就显得很重要了。
比如,很多情况下我们的url会包含用户的个人信息。因此,有时候,我们需要移除或禁用页面上的referer信息
再比如,在后台中使用了referer属性,会导致js和php的一些跳转出现问题,同时,也很有可能会导致一些第三方的统计代码失效,比如cnzz,百度统计,解决方法是不用该属性,或者使用iframe包裹一层,用一个独立的html页面加载统计代码!

referrer属性写法

在html页面中的<head>头部区域用meta标签添加referrer属性
Markup
  1. <meta name="referrer" content="属性值">
复制代码
content后面的“属性值”,常见有以下几种:
no-referrer:任何情况下都不发送Referrer信息;
no-referrer-when-downgrade:仅当协议降级(如从HTTPS页面跳转到HTTP页面)时不发送Referrer信息。是大部分浏览器默认策略。
origin:发送只包含host部分的referrer信息,也就是只包含了协议和域名的url,不包含域名后面部分,比如,来源网页url是https://baidu.com/1.html,但referrer值只包含http://www.baidu.com;
origin-when-cross-origin:仅在发生跨域访问时,发送只包含host的Referer信息,但在同域下还是完整的,而只有协议、域名和端口都一致时,浏览器才认为是同域。
unsafe-url:全部都发送Referrer信息,是最宽松,也是最不安全的策略
温馨提示:
1、referrer属性的<meta> 标签需要放在 <head> ...</head> 之间,如果出现的位置不对就会被忽略。
2、如果没有content 属性,或者 content 属性值为空,也会被忽略。
3、如果 content 属性后面的取值不合法,浏览器会自动选择 no-referrer 。

referrer属性用法

在html网页文档中,有两种方式,可以添加发送请求的referrer信息,分别是<meta>标签法和单个连接标签法

1、<meta>标签法(针对整个页面)

这种方法是针对属于当前网页中的所有链接,从任何一个链接跳转到其他页面,都会带上referrer信息。
如果想要在任何情况下,当前页面发送的请求不携带referrer信息,就这样写:
  1. <meta name="referrer" content="no-referrer">
复制代码
如果想要在任何情况下,当前页面发送的请求包含referrer信息,就这样写:
  1. <meta name="referrer" content="unsafe-url">
复制代码
这种情况下,如果当前页面使用了 https 协议,而要加载的资源使用的是 http 协议,加载资源的请求头中也会携带 referer。

2、单个链接标签法

这种方法可以只针对网页中具体的某一个或多个链接单独设置referrer,常常运用在<a>、<img>、<area>、<iframe>、<link>标签上。
<a rel="no-referrer" href="http://www.baidu.com" />百度</a>
<img rel="no-referrer" src="logo.png" />
值得注意的是:
这种单个链接标签法,只对该标签中链接有效,且referrer的属性值,只有三个,分别是:no-referrer、origin、unsafe-url;而且,单个链接标签法设置referrer的优先级比<meta>标签法要高。
另外,<a>、<area>、<link>标签中的单个链接,还可以使用rel="noreferrer"属性达到和no-referrer同样的效果,写法如下:
  1. <a rel="noreferrer" href="http://www.baidu.com" />百度</a>
复制代码
同样的,该方法使用rel="noreferrer"属性设置referrer的优先级比<meta>标签法要高。

3、HTML Img标签 src为网络地址无法显示图片问题解决

原理解析:
http请求头中有一个referrer字段,用来表示发起http请求的源地址信息
服务器端在拿到这个referrer值后判断请求是否来自本站
若不是则返回403,从而实现图片的防盗链。
上面出现403就是因为,请求的是别人服务器上的资源,但把自己的referrer信息带过去了,被对方服务器拦截返回了403
在前端可以通过meta来设置referrer policy(来源策略),referrer设置成no-referrer,发送请求不会带上referrer信息,对方服务器也就无法拦截了
到此这篇关于meta标签name="referrer"属性的写法和用法的文章就介绍到这了,更多相关meta标签name="referrer"属性内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!

0

主题

51

回帖

103

积分

注册会员

积分
103
发表于 2024-5-25 20:39:14 | 显示全部楼层
666666666666666666

1

主题

52

回帖

124

积分

注册会员

积分
124
发表于 2024-6-7 02:25:25 | 显示全部楼层
你的信息来源是?我想了解更多。

0

主题

41

回帖

83

积分

注册会员

积分
83
发表于 2024-7-10 03:25:05 | 显示全部楼层
能给个链接吗?我想深入了解一下。

0

主题

39

回帖

79

积分

注册会员

积分
79
发表于 2024-7-15 10:01:41 | 显示全部楼层
666666666666

1

主题

62

回帖

148

积分

注册会员

积分
148
发表于 2024-7-27 02:47:35 | 显示全部楼层
这个话题真是有趣,我也对它感兴趣。
发表于 2024-8-10 07:58:36 | 显示全部楼层
友善的讨论氛围是非常重要的。

1

主题

42

回帖

106

积分

注册会员

积分
106
发表于 2024-8-12 16:43:14 | 显示全部楼层
确实牛逼

2

主题

64

回帖

170

积分

注册会员

积分
170
发表于 2024-8-26 07:10:44 | 显示全部楼层
我不太确定,可能需要再确认一下。

3

主题

51

回帖

169

积分

注册会员

积分
169
发表于 2024-9-4 23:45:41 | 显示全部楼层
太棒了!感谢分享这个信息!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|爱云论坛 - d.taiji888.cn - 技术学习 免费资源分享 ( 蜀ICP备2022010826号 )|天天打卡

GMT+8, 2024-11-15 11:37 , Processed in 0.228328 second(s), 27 queries .

Powered by i云网络 Licensed

© 2023-2028 正版授权

快速回复 返回顶部 返回列表