使用Fetch API读取响应标头 [英] Reading response headers with Fetch API

问题描述

我使用的Google Chrome浏览器扩展程序的权限为*：// * / *，我试图从XMLHttpRequest切换到< a href =https://developers.google.com/web/updates/2015/03/introduction-to-fetch =noreferrer>抓取API 。

扩展存储用户输入的登录数据，这些数据以前直接放入XHR的open（）调用中进行HTTP身份验证，但在提取下不能再直接用作参数。对于HTTP Basic Auth，绕过这个限制是微不足道的，因为您可以手动设置授权标头：

  fetch（url，{
头文件：新头文件（{'Authorization'：'Basic'+ btoa（login +'：'+ pass）}）
}}）; 
  

HTTP Digest Auth 然而需要更多的交互性;您需要读取服务器通过401响应发送的参数来制作有效的授权令牌。我试着用这段代码阅读 WWW-Authenticate 响应标题字段：

 <$ c （函数（val，key）{console.log（key +' - >'+ val）;}）;函数（resp）{
 resp.headers.forEach 
} 
  

但是我得到的只是这个输出：

  content-type  - > text / html; charset = iso-8859-1 
  

根据Chrome的开发者工具，它本身是正确的，但仍然缺少6个字段。如果我使用 resp.headers.get（WWW-验证）（或任何其他字段），我只得到 null 。

使用Fetch API访问其他字段的机会有多大？

解决方案

访问响应有限制如果您使用Fetch API over CORS，那么您可以通过以下标准标题访问标题：

• Cache-Control


• Content-Language


• Content-Type


• 过期


• Last-Modified


• Pragma
  $ b

  在编写Google Chrome浏览器扩展程序的代码时，您使用的是 CORS ，因此您无法访问所有标题。如果您控制服务器，则可以在响应 body 而不是标头

  $ b中返回自定义信息
  $ b

  有关此限制的更多信息 - https://developers.google.com/web/updates/2015/03/introduction-to-fetch#response_types

  
  

  I'm in a Google Chrome extension with permissions for "*://*/*" and I'm trying to make the switch from XMLHttpRequest to the Fetch API.

  The extension stores user-input login data that used to be put directly into the XHR's open() call for HTTP Auth, but under Fetch can no longer be used directly as a parameter. For HTTP Basic Auth, circumventing this limitation is trivial, as you can manually set an Authorization header:

  fetch(url, {
    headers: new Headers({ 'Authorization': 'Basic ' + btoa(login + ':' + pass) })
    } });
  

  HTTP Digest Auth however requires more interactivity; you need to read parameters that the server sends you with its 401 response to craft a valid authorization token. I've tried reading the WWW-Authenticate response header field with this snippet:

  fetch(url).then(function(resp) {
    resp.headers.forEach(function(val, key) { console.log(key + ' -> ' + val); });
  }
  

  But all I get is this output:

  content-type -> text/html; charset=iso-8859-1
  

  Which by itself is correct, but that's still missing around 6 more fields according to Chrome's Developer Tools. If I use resp.headers.get("WWW-Authenticate") (or any of the other fields for that matter), i get only null.

  Any chance of getting to those other fields using the Fetch API?

  解决方案

  There is a restriction to access response headers when you are using Fetch API over CORS. Due you this restriction, you can access only following standard headers:

  • Cache-Control
  • Content-Language
  • Content-Type
  • Expires
  • Last-Modified
  • Pragma

  When you are writing code for Google Chrome extension, you are using CORS, hence you can't access all headers. If you control the server, you can return custom information in the response body instead of headers

  More info on this restriction - https://developers.google.com/web/updates/2015/03/introduction-to-fetch#response_types

  这篇关于使用Fetch API读取响应标头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！