如何通过JavaScript访问页面的HTTP响应头?
与此问题相关,该问题已修改为询问有关访问两个特定HTTP标头的问题.
相关:
如何通过JavaScript访问HTTP请求标头字段?
小智.. 355
无法读取当前标头.您可以对同一个URL发出另一个请求并读取其标题,但不能保证标题与当前标题完全相同.
使用以下JavaScript代码通过执行get
请求获取所有HTTP标头:
var req = new XMLHttpRequest(); req.open('GET', document.location, false); req.send(null); var headers = req.getAllResponseHeaders().toLowerCase(); alert(headers);
Saeed,也许不是最好的问题作者..我想这是因为它不访问加载资源的标题,但提出了一个新请求..显然他知道最好的,最好的答案是什么,并自己做了 (57认同)
根据您之后的标题,您可能想要使用"HEAD"动词. (17认同)
只有在您需要的响应值保证从一个请求到下一个请求相同时,才能生成新请求.这取决于您的应用程序,因此您使用此类方法的里程数会有所不同. (17认同)
这个答案非常错误.正确答案是"这是不可能的".或者为了适应这个答案"这是不可能的,但这是一个试图模拟它的黑客,它可能或根本不适合你". (9认同)
这种hack可能在某些情况下有效,但如果包含脚本的页面是为了响应POST请求而生成的,那么它根本不起作用,如果你试图确定服务器是否遇到错误它就无济于事(HTTP 5XX)处理原始请求时. (6认同)
keparo.. 295
遗憾的是,没有API为您的初始页面请求提供HTTP响应标头.那是这里发布的原始问题.它也一再被问到,因为有些人想要获得原始页面请求的实际响应头而不发出另一个.
如果通过AJAX发出HTTP请求,则可以使用该getAllResponseHeaders()
方法获取响应头.它是XMLHttpRequest API的一部分.要了解如何应用此fetchSimilarHeaders()
功能,请查看以下功能.请注意,这是针对某些应用程序无法可靠的问题的解决方法.
myXMLHttpRequest.getAllResponseHeaders();
API在以下针对XMLHttpRequest的候选推荐中指定:XMLHttpRequest - W3C候选推荐2010年8月3日
具体地,getAllResponseHeaders()
方法在下面的部分中指定:w3.org: XMLHttpRequest
:该getallresponseheaders()
方法
MDN文档也很好:developer.mozilla.org :XMLHttpRequest
.
这不会为您提供有关原始页面请求的HTTP响应标头的信息,但它可以用于对这些标头是什么进行有根据的猜测.接下来将介绍更多相关内容.
这个问题是几年前首次提出的,具体询问如何获取当前页面的原始HTTP响应头(即javascript运行的同一页面).这是一个完全不同的问题,而不仅仅是获取任何HTTP请求的响应头.对于初始页面请求,标头不可用于javascript.如果您通过AJAX再次请求同一页面,那么您需要的标头值是否可靠且足够一致将取决于您的特定应用程序.
以下是解决该问题的一些建议.
如果响应在很大程度上是静态的,并且请求之间的标题不会发生很大变化,那么您可以针对当前所在的同一页面发出AJAX请求,并假设它们是相同的值,它们是页面的一部分. HTTP响应.这可以允许您使用上面描述的nice XMLHttpRequest API访问所需的标头.
function fetchSimilarHeaders (callback) { var request = new XMLHttpRequest(); request.onreadystatechange = function () { if (request.readyState === XMLHttpRequest.DONE) { // // The following headers may often be similar // to those of the original page request... // if (callback && typeof callback === 'function') { callback(request.getAllResponseHeaders()); } } }; // // Re-request the same page (document.location) // We hope to get the same or similar response headers to those which // came with the current page, but we have no guarantee. // Since we are only after the headers, a HEAD request may be sufficient. // request.open('HEAD', document.location, true); request.send(null); }
如果您真的必须依赖请求之间保持一致的值,那么这种方法会有问题,因为您无法完全保证它们是相同的.这将取决于您的具体应用程序,以及您是否知道您需要的价值不会从一个请求更改为下一个请求.
有一些BOM性质,其浏览器确定通过查看头(浏览器对象模型).其中一些属性直接反映HTTP标头(例如navigator.userAgent
,设置为HTTP User-Agent
标头字段的值).通过嗅探可用的属性,您可以找到所需的内容,或者一些线索来指示HTTP响应包含的内容.
如果您控制服务器端,则可以在构建完整响应时访问任何您喜欢的标头.值可以通过页面传递给客户端,存储在某个标记中,也可以存储在内联的JSON结构中.如果您希望每个HTTP请求标头都可用于您的javascript,您可以在服务器上迭代它们并将它们作为隐藏值发送回标记中.以这种方式发送标头值可能并不理想,但您当然可以针对您需要的特定值执行此操作.这个解决方案也可能效率低下,但是如果你需要的话,它可以胜任.
无法读取当前标头.您可以对同一个URL发出另一个请求并读取其标题,但不能保证标题与当前标题完全相同.
使用以下JavaScript代码通过执行get
请求获取所有HTTP标头:
var req = new XMLHttpRequest(); req.open('GET', document.location, false); req.send(null); var headers = req.getAllResponseHeaders().toLowerCase(); alert(headers);
遗憾的是,没有API为您的初始页面请求提供HTTP响应标头.那是这里发布的原始问题.它也一再被问到,因为有些人想要获得原始页面请求的实际响应头而不发出另一个.
如果通过AJAX发出HTTP请求,则可以使用该getAllResponseHeaders()
方法获取响应头.它是XMLHttpRequest API的一部分.要了解如何应用此fetchSimilarHeaders()
功能,请查看以下功能.请注意,这是针对某些应用程序无法可靠的问题的解决方法.
myXMLHttpRequest.getAllResponseHeaders();
API在以下针对XMLHttpRequest的候选推荐中指定:XMLHttpRequest - W3C候选推荐2010年8月3日
具体地,getAllResponseHeaders()
方法在下面的部分中指定:w3.org: XMLHttpRequest
:该getallresponseheaders()
方法
MDN文档也很好:developer.mozilla.org :XMLHttpRequest
.
这不会为您提供有关原始页面请求的HTTP响应标头的信息,但它可以用于对这些标头是什么进行有根据的猜测.接下来将介绍更多相关内容.
这个问题是几年前首次提出的,具体询问如何获取当前页面的原始HTTP响应头(即javascript运行的同一页面).这是一个完全不同的问题,而不仅仅是获取任何HTTP请求的响应头.对于初始页面请求,标头不可用于javascript.如果您通过AJAX再次请求同一页面,那么您需要的标头值是否可靠且足够一致将取决于您的特定应用程序.
以下是解决该问题的一些建议.
如果响应在很大程度上是静态的,并且请求之间的标题不会发生很大变化,那么您可以针对当前所在的同一页面发出AJAX请求,并假设它们是相同的值,它们是页面的一部分. HTTP响应.这可以允许您使用上面描述的nice XMLHttpRequest API访问所需的标头.
function fetchSimilarHeaders (callback) { var request = new XMLHttpRequest(); request.onreadystatechange = function () { if (request.readyState === XMLHttpRequest.DONE) { // // The following headers may often be similar // to those of the original page request... // if (callback && typeof callback === 'function') { callback(request.getAllResponseHeaders()); } } }; // // Re-request the same page (document.location) // We hope to get the same or similar response headers to those which // came with the current page, but we have no guarantee. // Since we are only after the headers, a HEAD request may be sufficient. // request.open('HEAD', document.location, true); request.send(null); }
如果您真的必须依赖请求之间保持一致的值,那么这种方法会有问题,因为您无法完全保证它们是相同的.这将取决于您的具体应用程序,以及您是否知道您需要的价值不会从一个请求更改为下一个请求.
有一些BOM性质,其浏览器确定通过查看头(浏览器对象模型).其中一些属性直接反映HTTP标头(例如navigator.userAgent
,设置为HTTP User-Agent
标头字段的值).通过嗅探可用的属性,您可以找到所需的内容,或者一些线索来指示HTTP响应包含的内容.
如果您控制服务器端,则可以在构建完整响应时访问任何您喜欢的标头.值可以通过页面传递给客户端,存储在某个标记中,也可以存储在内联的JSON结构中.如果您希望每个HTTP请求标头都可用于您的javascript,您可以在服务器上迭代它们并将它们作为隐藏值发送回标记中.以这种方式发送标头值可能并不理想,但您当然可以针对您需要的特定值执行此操作.这个解决方案也可能效率低下,但是如果你需要的话,它可以胜任.
使用XmlHttpRequest
您可以拉出当前页面,然后检查响应的http标头.
最好的情况是只做一个HEAD
请求,然后检查标题.
有关这方面的一些示例,请查看http://www.jibbering.com/2002/4/httprequest.html
只需2美分.
服务工作者能够访问包括标题的网络信息.好的部分是它适用于任何类型的请求,而不仅仅是XMLHttpRequest.
在您的网站上添加服务工作者.
观察正在发送的每个请求.
fetch
使用该respondWith
功能使服务工作者成为请求.
当响应到达时,读取标题.
将标头从服务工作者发送到具有该postMessage
功能的页面.
服务工作者理解起来有点复杂,所以我建立了一个小型库来完成这一切.它可以在github上找到:https://github.com/gmetais/sw-get-headers.
该网站需要使用HTTPS
浏览器需要支持新的Service Workers API
相同的域/跨域策略正在运行,就像在XMLHttpRequest上一样
对于那些寻找将所有HTTP头解析为可以作为字典访问的对象的方法的人headers["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"]
将标头信息发送到JavaScript的另一种方法是通过cookie.服务器可以从请求标头中提取所需的任何数据,并将它们发送回Set-Cookie
响应标头 - 并且可以使用JavaScript读取cookie.正如keparo所说,最好只针对一个或两个标题,而不是针对所有标题.
如果我们讨论的是Request头,您可以在执行XmlHttpRequests时创建自己的头.
var request = new XMLHttpRequest(); request.setRequestHeader("X-Requested-With", "XMLHttpRequest"); request.open("GET", path, true); request.send(null);