从referer角度详解

一、referer翻译

Referer一般被译为“引用页”、“引荐页面”、“来源页”等。在HTTP协议中，当浏览器向Web服务器请求某个资源时，通常会带上Referer信息，表示请求来源于哪个页面。

二、如何允许referer为空

通常情况下，浏览器会在请求头中自动添加Referer信息。但是，在某些情况下，我们希望浏览器不要传递Referer信息，甚至希望Referer信息为空。这时可以通过以下手段实现：

1、设置meta标签：许多网站会通过设置meta标签来禁止Referer信息泄露。

<meta name="referrer" content="no-referrer">

2、使用JavaScript：在发送请求之前，可以使用JavaScript代码来指定请求头，从而达到限制或清除Referer信息的目的。

fetch('http://example.com', {
  headers: {
    'Referer': ''
  }
})

三、referer字段的作用

Referer字段在很多场景下都有着重要的作用，下面列举几个常见的应用场景：

1、防盗链：有些站点希望通过Referer信息来判断图片、视频等资源的请求来源，从而进行防盗链操作。

if(!strpos($_SERVER['HTTP_REFERER'], 'http://www.example.com/')) {
  exit('非法访问！');
}

2、统计分析：通过Referer信息，可以了解到用户从哪些站点链接访问、搜索引擎关键词、页面URL等等，有助于优化站点SEO、分析用户行为、制定运营策略等。

//统计百度搜索引擎的关键词
if(strpos($_SERVER['HTTP_REFERER'], 'http://www.baidu.com/') !== false) {
  $q = str_replace('q=', '', parse_url($_SERVER['HTTP_REFERER'])['query']);
  $keyword = urldecode($q);
  add_statistic('baidu', $keyword);
}

四、referer 360没有

360浏览器在某些情况下不会发送Referer信息，这可能会对某些站点的安全策略、统计分析等功能造成问题。如果需要在360浏览器中使用Referer信息，可以通过以下方式解决：

1、通过JavaScript手动添加：可以通过JavaScript代码来手动添加Referer信息。

var img = new Image();
img.src = 'http://example.com/image.jpg';
img.setAttribute('referrerPolicy', 'unsafe-url');

2、使用nginx反向代理：通过nginx的反向代理配置，可以在后端获取普通浏览器中的Referer信息。

location /example/ {
  proxy_pass http://example.com/;
  proxy_set_header Referer "http://example.com/";
}

五、referer check error

在某些情况下，我们可能会在后台代码中检查Referer信息。但是，由于Referer信息可能会被篡改、伪造、隐藏等，因此需要进行一些处理才能确保其可靠性。

1、检查Referer是否为空：虽然我们可以通过JavaScript或meta标签来清除Referer信息，但在前端无法控制的场景下，Referer信息可能为空。因此在代码中检查Referer是否为空很重要。

if(empty($_SERVER['HTTP_REFERER'])) {
  exit('非法访问！');
}

2、检查Referer域名：在某些场景下，我们可能希望只接受来自特定域名的Referer信息。在检查Referer域名时，需要考虑Referer信息可能会被修改或伪造的情况。

$referer = parse_url($_SERVER['HTTP_REFERER']);
if($referer['host'] !== 'www.example.com') {
  exit('非法访问！');
}

六、百度地图的referer

在使用百度地图API时，需要在请求中添加合法的referer信息，否则会返回错误码。referer信息由“协议+域名”的形式组成，例如“http://localhost/”。

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=YOUR_APP_KEY"></script>

<script type="text/javascript">
    // 创建Map实例
    var map = new BMap.Map("allmap");
    // 初始化地图
    map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
</script>

七、微信小程序设置referer选取

在使用微信小程序的开发者工具时，可以在菜单栏中的“项目”-“设置”中设置referer地址。设置referer地址后，在小程序中调用其他API时，请求头中会带上referer信息。

//设置referer地址
wx.setStorageSync('test_referer', 'http://www.example.com/');

//发送请求
wx.request({
  url: 'http://api.example.com/',
  header: {
    'referer': wx.getStorageSync('test_referer')
  }
});

原创文章，作者：PSFF，如若转载，请注明出处：https://www.506064.com/n/144862.html