referrer or referer

本贴最后更新于 3028 天前,其中的信息可能已经事过境迁

某天看到小伙伴写了 referrer,还问是不是写错了。原来是这样子的~~~


上回我写了一篇文章介绍「Referrer Policy」,有小伙伴看完后问我:Referrer 这个单词到底怎么拼,为什么有时候中间有两个 r,有时候只有一个?

是的,这是一个很有趣的问题,这里就给有疑惑的同学们科普下。

HTTP 中的 Referrer

HTTP 协议中有一个用来表示页面或资源来源的请求头,由 Philip Hallam-Baker 于上世纪 90 年代提出来,他当时把这个请求头叫做 Referer,并最终写进了 RFC1945,也就是 HTTP/1.0 协议:

The Referer request-header field allows the client to specify, for the server's benefit, the address (URI) of the resource from which the Request-URI was obtained. via

有趣的是,当时这个单词被他拼错了,正确的拼写应该是 Referrer。但是这个错误被发现之前,已经被大量使用,如果要改过来需要所有服务端、客户端的一致配合,还有大量的代码需要排查修改。于是,HTTP 的标准制定者们决定将错就错,不改了。下面这段描述来自于 RFC2616,也就是著名的 HTTP/1.1 协议:

The Referer[sic] request-header field allows the client to specify, for the server's benefit, the address (URI) of the resource from which the Request-URI was obtained (the "referrer", although the header field is misspelled.) via

可以看到,相比 HTTP/1.0,HTTP/1.1 除了加上了对这个错误的说明之外,没有其他变化。另外,那个 [sic] 是拉丁文里「原文如此」的意思。很多其他标准在表述 HTTP 中的 Referer 请求头时,都会加上 [sic],避免引起读者误解。

由此可见,HTTP 标准制定者奉行实用主义,能用就行。由于 HTTP 协议继续拼错,浏览器当然只好按错的来,服务端收到的也是拼错的,所以大部分 Web Server、服务端语言或框架,都跟着拼错。举几个例子:

  • Nginx:ngx_http_referer_module - used to block access to a site for requests with invalid values in the "Referer" header field;
  • PHP:$_SERVER['HTTP_REFERER'] - The address of the page (if any) which referred the user agent to the current page;
  • Django:HttpRequest.META.HTTP_REFERER – The referring page, if any;
  • ThinkJS:Controller.referer() - 获取 referer;

JavaScript 中的 Referrer

这里说的 JavaScript,都是针对宿主为浏览器的场景,获取到的 referrer 属性都是由浏览器提供的。这一次,浏览器们比较齐心,都采用了正确的拼写方式,没有让这个错误在 JavaScript 中延续。

例如 DOM Level 2 里定义的 document.referrer

Returns the URI [IETF RFC 2396] of the page that linked to this page. The value is an empty string if the user navigated to the page directly (not through a link, but, for example, via a bookmark). via

最新的 Fetch API 中的 Request 接口,也有一个名为 referrer 的属性:

The referrer attribute's getter must return the empty string if request's referrer is no referrer, "about:client" if request's referrer is client and request's referrer, serialized, otherwise. via

更多关于 Fetch API 的介绍可以查看月影大大翻译的这篇文章:这个 API 很“迷人”——(新的 Fetch API)

其他标准中的 Referrer

其他标准,例如 Referrer Policy,也采用了正确的写法,并且明确表示不会兼容错误的拼写,例如在 Delivery via CSP 这一节写着:

Note: The directive name does not share the HTTP header's misspelling.

结论

HTTP 请求中的 Referer 是一个典型的拼写错误,历史悠久,可以预见还会一直错下去。也许以后 Referer 会变成一个专有名词也说不定。所以,一般涉及到读取 HTTP 请求头的场景,我们需要用 Referer 这种错误拼写;除此之外一般都要用 Referrer 这种正确的拼写。

转自链接:https://imququ.com/post/referrer-or-referer.html

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • yangyujiao

    我从老公司走的时候,就研究过这个 referrer。是为了获取到上个页面地址,做返回用的。但是我的电脑用怎么写都不行······

    而且我们用还不是为了解决 pc 端,是为了 html5 用的,为了 html5 中多页面进入同一个页面,返回的问题。
    反正最后我也没有搞定这个 referrer,是用另一种方式实现的。。。

    1 回复
  • Vanessa

    返回不是用 history 么?我们主要是用于统计引流来源的

    1 回复
  • 88250

    学习啦,很不错的细节,还好我一直都是复制粘贴.... 这个拼写问题也让我想起了 Ken Thompson 和 creat 🙏

  • yangyujiao

    不能用那个什么 go(-1)。但是具体为啥,我不是很清楚。我不太明白前端这些东西,当时让查一下用 referrer 实现,我就查了查。但是按照网上的写法都不行,,,然后我就用别的方法了。

    1 回复
  • Vanessa

    哈哈。我也不知道为什么啦

  • virtualpier

    学习了~

  • someone1764

    看外面还以为是有 23 回复,原来改了啊

    1 回复
  • Vanessa

    没改呀。以前是没有,现在是直接加上

    1 回复
  • someone1764

    以前外面文章后面是回复数..现在是浏览数

请输入回帖内容 ...