如何通过JavaScript访问页面的HTTP响应头?

与此问题相关,该问题已被修改为询问访问两个特定的HTTP报头。

相关: 如何通过JavaScript访问HTTP请求报头字段?


当前回答

对于那些寻找一种方法来解析所有HTTP头到一个对象,可以访问作为字典头["content-type"],我已经创建了一个函数parseHttpHeaders:

function parseHttpHeaders(httpHeaders) {
    return httpHeaders.split("\n")
     .map(x=>x.split(/: */,2))
     .filter(x=>x[0])
     .reduce((ac, x)=>{ac[x[0]] = x[1];return ac;}, {});
}

var req = new XMLHttpRequest();
req.open('GET', document.location, false);
req.send(null);
var headers = parseHttpHeaders(req.getAllResponseHeaders());
// Now we can do:  headers["content-type"]

其他回答

Service worker的解决方案

Service worker能够访问包括头信息在内的网络信息。好处是它可以处理任何类型的请求,而不仅仅是XMLHttpRequest。

工作原理:

在你的网站上添加一个服务人员。 观察正在发送的每个请求。 让service worker使用respondWith函数获取请求。 当响应到达时,读取报头。 使用postMessage函数将header从service worker发送到页面。

工作的例子:

理解服务工作者有点复杂,所以我建立了一个小库来做所有这些工作。可以在github上找到:https://github.com/gmetais/sw-get-headers。

限制:

该网站需要使用HTTPS 浏览器需要支持Service Workers API 同域/跨域策略正在起作用,就像在XMLHttpRequest上一样

这是一个老问题。不确定何时支持变得更广泛,但getAllResponseHeaders()和getResponseHeader()现在似乎是相当标准的:http://www.w3schools.com/xml/dom_http.asp

Allain Lalonde的链接让我很开心。 只是在这里添加了一些简单的html代码。 适用于任何合理的浏览器,年龄加上IE9+和preto - opera 12。

<!DOCTYPE html>
<title>(XHR) Show all response headers</title>

<h1>All Response Headers with XHR</h1>
<script>
 var X= new XMLHttpRequest();
 X.open("HEAD", location);
 X.send();
 X.onload= function() { 
   document.body.appendChild(document.createElement("pre")).textContent= X.getAllResponseHeaders();
 }
</script>

注意:你得到第二个请求的头,结果可能不同于最初的请求。

另一种方法是更现代的fetch() API https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch 根据caniuse.com, Firefox 40, Chrome 42, Edge 14, Safari 11都支持它 工作示例代码:

<!DOCTYPE html>
<title>fetch() all Response Headers</title>

<h1>All Response Headers with fetch()</h1>
<script>
 var x= "";
 if(window.fetch)
    fetch(location, {method:'HEAD'})
    .then(function(r) {
       r.headers.forEach(
          function(Value, Header) { x= x + Header + "\n" + Value + "\n\n"; }
       );
    })
    .then(function() {
       document.body.appendChild(document.createElement("pre")).textContent= x;
    });
 else
   document.write("This does not work in your browser - no support for fetch API");
</script>

我觉得这个问题问错了, 如果你想从JQuery/JavaScript中获取Request头,答案是No。另一种解决方案是创建一个aspx页面或jsp页面,这样我们就可以很容易地访问请求头。 把aspx页面中的所有请求放到一个会话/cookie中,然后你可以访问JavaScript页面中的cookie。

您不能访问http报头,但是其中提供的一些信息在DOM中是可用的。例如,如果你想查看http引用器(原文如此),使用document.referrer。可能还有其他类似的http头文件。试着谷歌一下你想要的具体内容,比如“http referer javascript”。

我知道这应该是显而易见的,但我一直在搜索像“http headers javascript”这样的东西,而我真正想要的只是引用器,并没有得到任何有用的结果。我不知道我怎么没意识到我可以问个更具体的问题。