Ajax 和 History.js 发送错误的引荐来源网址答案

【问题标题】：Ajax and History.js sends wrong referrerAjax 和 History.js 发送错误的引荐来源网址
【发布时间】：2014-11-25 18:39:50
【问题描述】：

我有一个使用 jQuery 和 History.js 的 Ajax 站点，当单击链接时，我执行以下操作：

var $this = $(this), // $(this) is the link
url = $this.attr('href'),
title = $this.attr('title') || null;
History.pushState(null, title, url);
event.preventDefault();

然后我查看 statechange 以进行 ajax 调用并更改页面内容：

$(window).bind('statechange', function () {
     var State = History.getState(),
     url = State.url
     $.ajax({
        url: url,
        success: function (data, textStatus, jqXHR) {
           // I change the content etc etc
        }
});

但是 Referrer 标头始终是被请求的 URL，例如，我在我的页面“/home”上单击带有 href “/test”的链接，然后代码会将 ajax 调用发送到 /test，但在该请求中，它作为引用者发送相同的“/test”而不是“/home”。

我尝试在 pushState 之后进行 ajax 调用，它可以正常发送引荐来源网址，但后退按钮只是停止工作，它会更改 url 但不会更改内容，所以我需要再次查找 statechange。

我能做什么？

对不起我的英语，谢谢！

【问题讨论】：

$.ajax() 允许手动设置请求标头 - 请参阅 API docs - 因此您可以尝试将引用标头设置为 /home。
谢谢@Roamer-1888 我也看到了这个选项，但我读到的只是浏览器出于安全原因会覆盖引用者。在这里阅读：changing the referrer of an Ajax POST 所以我不测试。
在这种情况下，您似乎不能依赖“statechange”处理程序来发出 AJAX 请求。尝试将流程由内而外 - 进行 AJAX 调用，然后在成功处理程序中执行 History.pushState()。
再次感谢@Roamer-1888 我试过了，它可以工作但是正如我所说，后退按钮停止工作，因为当用户按下资源管理器的后退按钮时，它会执行“状态更改”。 ..所以就像我需要知道用户何时返回或前进，而不是执行AJAX调用，有什么问题吗？谢谢！
我认为大多数人最终会更改 url 的 #hash 字符串而不是创建历史条目。

标签： javascript jquery ajax history.js

【解决方案1】：

没关系，我的解决方案是：首先进行 ajax 调用，然后是 History.pushState 成功，正如我之前所说，但要解决后退/前进按钮只需要听“popstate”而不是“statechange”。 'popstate' 是解决方案。

问候。

【讨论】：

很高兴这适用于您的用例，但我会警告一般不要以这种方式构建。你最终会有很多额外的逻辑，相当于“检查并查看这是否是我推送的状态，或者它是否是 浏览器 基于后退/前进点击推送的相同状态。”看起来方便发送该信息的地方是状态本身，但是当它是推送状态时它会骗你！ IMO “Referer”标头不值得——我只需更改应用程序以接受引用参数（或自定义标头）并使用它而不是标头。