host、referer和origin的区别

在http协议中这三个请求头比较容易让人产生混淆。

host比较容易理解，来看下MDN网站给的介绍：

Host 请求头指明了服务器的域名（对于虚拟主机来说），以及（可选的）服务器监听的TCP端口号。 如果没有给定端口号，会自动使用被请求服务的默认端口（比如请求一个HTTP的URL会自动使用80端口）。 HTTP/1.1 的所有请求报文中必须包含一个Host头字段。如果一个 HTTP/1.1 请求缺少 Host 头字段或者设置了超过一个的 Host 头字段，一个400（Bad Request）状态码会被返回。

从上面的文字中可以总结出如下信息：

1、host的值为客户端请求的服务器的域名（或者ip）和端口

2、http/1.1中必须包含host请求头，且只能设置一个；

那么host主要用在什么地方呢？

host用的最多的场景是：单台服务器设置多个虚拟主机时。

举个简单的例子： 我在IP地址为127.0.0.1的服务器上，通过apache配置了两个虚拟主机：a.com,b.com，这两个域名通过DNS解析都会指向127.0.0.1，我在浏览器中访问a.com的网站时，DNS将域名转化为IP地址，此时可以通过客户端请求头的host信息判断访问的是服务器上对应的虚拟主机。

如图：

如果没有host请求头，客户端的请求就不能标记出该访问哪个虚拟主机了。

接着看一下MDN对referer的介绍：

Referer 首部包含了当前请求页面的来源页面的地址，即表示当前页面是通过此来源页面里的链接进入的。服务端一般使用 Referer 首部识别访问来源，可能会以此进行统计分析、日志记录以及缓存优化等。 需要注意的是 referer 实际上是 "referrer" 误拼写。

在以下两种情况下，Referer 不会被发送：

1.来源页面采用的协议为表示本地文件的 "file" 或者 "data" URI；

2.当前请求页面采用的是非安全协议，而来源页面采用的是安全协议（HTTPS）。

3.直接输入网址或通过浏览器书签访问

4.使用 JavaScript 的 Location.href 或者是 Location.replace()

5.使用html5中noreferrer

<a href="/test/index.php?noreferer" rel="noreferrer" target="_blank">noreferrer</a> 
<a href="/test/index.php?noreferer" rel="noreferrer" target="_blank">noreferrer</a>

6.使用 Referer Meta 标签控制 referer 使用场景，具体参考如下文章：https://www.jb51.net/article/137982.htm

7.使用iframe的hack写法去除referer。

这里给大家举一个例子，百度的图片防盗链：

html代码如下：

鼠标双击这张网页直接打开，也就是file协议访问，此时是不带referer的，图片是显示的，如图：

network如图，此时没有referer请求头：

但是我将其发布到服务器上，用http://127.0.0.1/a2.html来访问，如图：

图片不显示了，为什么呢？观察请求头，如图：

多了一个referer的请求头，请求头标识了访问这张图片请求的源头，请求源头为我的网站，百度图片服务器根据这个请求头判断，然后将我拦截了。

那么如何破解盗链呢，常用的是用一个服务器程序作为代理爬虫，服务器爬虫可以自由设置请求头了，还有就是利用iframe的hack写法了。这种写法类似xss，那什么是xss呢？这里先不说，下期讨论。

iframe去除referer的写法如下，看代码：

显示结果如图：

再看network如图：

referer消失了。referer消失后，跳过了百度的防盗链。

最后是origin了，看一年MDN对其的介绍：

请求首部字段 Origin 指示了请求来自于哪个站点。该字段仅指示服务器名称，并不包含任何路径信息。该首部用于 CORS 请求或者 POST 请求。除了不包含路径信息，该字段与 Referer 首部字段相似。

可以看到referer与origin功能相似，但是还是有几点不同，仔细看上面的介绍，总结如下几点：

1、只有跨域请求，或者同域时发送post请求，才会携带origin请求头，而referer不论何种情况下，只要浏览器能获取到请求源都会携带，除了上面提到的几种情况。

2、如果浏览器不能获取请求源，那么origin满足上面情况也会携带，不过其值为null，如图：

这点与referer不同，浏览器如果不能获取请求源，那么请求头中不会携带referer。

3、origin的值只包括协议、域名和端口，而erferer不但包括协议、域名、端口还包括路径，参数，注意不包括hash值。