如何通过 JavaScript 访问 HTTP 请求标头字段？

Question

我想在客户端 JavaScript 中捕获 HTTP 请求标头字段，主要是 Referer 和 User-Agent。 我如何访问它们？

---

Google Analytics 设法通过 JavaScript 获取您嵌入页面中的数据，因此这绝对是可能的。

有关的：
在 JavaScript 中访问网页的 HTTP 标头

Answer 1

如果您想访问引用者和用户代理，它们可用于客户端 Javascript，但不能直接访问标头。

要检索引用者，请使用document.referrer 。
要访问用户代理，请使用navigator.userAgent 。

正如其他人所指出的，HTTP 标头不可用，但您特别询问了可通过 Javascript 获得的引用器和用户代理。

Answer 2

几乎根据定义，客户端 JavaScript 不在 http 请求的接收端，因此它没有要读取的标头。 最常见的是，您的 JavaScript 是 http 响应的结果。 如果您尝试获取生成响应的 http 请求的值，则必须编写服务器端代码以将这些值嵌入您生成的 JavaScript 中。

让服务器端代码生成客户端代码有点棘手，所以请确保这是您所需要的。 例如，如果您想要用户代理信息，您可能会发现获取 JavaScript 为浏览器检测提供的各种值就足够了。 从 navigator.appName 和 navigator.appVersion 开始。

Answer 3

这可以通过 Javascript 访问，因为它是加载文档的属性，而不是其父文档的属性。

这是一个快速示例：

<script type="text/javascript">
document.write(document.referrer);
</script>

在 PHP 中同样的事情是：

<?php echo $_SERVER["HTTP_REFERER"]; ?>

Answer 4

Referer 和 user-agent 是请求头，而不是响应头。

这意味着它们是由浏览器或您的 ajax 调用（您可以修改值）发送的，并且它们在您获得 HTTP 响应之前就已决定。

所以基本上你不是要求 HTTP 标头，而是浏览器设置。

你从 document.referer 和 navigator.userAgent 得到的值可能不是实际的头部，而是浏览器的设置。

Answer 5

从 JavaScript 获取标头的一种方法是使用 WebRequest API，它允许我们访问源自 http 或 websockets 的不同事件，生命周期如下： WebRequest Lifecycle

所以为了访问页面的标题，它会是这样的：

    browser.webRequest.onHeadersReceived.addListener(
     (headersDetails)=> {
      console.log("Request: " + headersDetails);
    },
    {urls: ["*://hostName/*"]}
    );`

问题是为了使用这个API，它必须从浏览器中执行，即浏览器对象指的是浏览器本身（标签、图标、配置），而浏览器确实可以访问所有的Request和Reponse任何页面，因此您必须向用户询问权限才能执行此操作（必须在清单中声明权限，浏览器才能执行它们）

并且作为浏览器的一部分，您将失去对页面的控制，也就是说，您不能再操作 DOM（不是直接操作），因此要再次控制 DOM，可以按如下方式进行：

    browser.webRequest.onHeadersReceived.addListener(
        browser.tabs.executeScript({
        code: 'console.log("Headers success")',
    });
});

或者如果你想运行很多代码

    browser.webRequest.onHeadersReceived.addListener(
        browser.tabs.executeScript({
        file: './headersReveiced.js',
    });
});

此外，通过控制浏览器，我们可以注入 CSS 和图像

文档： https : //developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/webRequest/onHeadersReceived

Answer 6

我想谷歌会在服务器端抓取一些数据——记住，当一个页面加载到你的浏览器中时，其中包含谷歌分析代码，你的浏览器会向谷歌的服务器发出请求； Google 可以通过这种方式以及通过嵌入在页面中的 JavaScript 来获取数据。

Answer 7

var ref = Request.ServerVariables("HTTP_REFERER");

在引号内键入您想要的任何其他服务器变量名称。