未使用 fetch() 发送 HTTP 标头

Question

我正在尝试在我的应用上配置后端 API，这是发送请求的代码：

static async xhr(endpoint, args, method) {
  const url = `${API_SERVER}${endpoint}`;
  let formBody = [];
  for (let property in args) {
      let encodedKey = encodeURIComponent(property);
      let encodedValue = encodeURIComponent(args[property]);
      formBody.push(encodedKey + "=" + encodedValue);
  }
  formBody = formBody.join("&");
  let options = Object.assign({ method: method }, args ? { body: formBody } : null );
  try {
    let headers = {
        'Accept': 'application/json',
        'Content-Type': 'application/x-www-form-urlencoded',
    };
    accessToken = 'bdi8HD8js91jdoach7234h';
    if(accessToken != null)
        headers['Authorization'] = accessToken;
    options.headers = headers;
    return fetch(url, options).then( resp => {
        console.log(resp);
        let json = resp.json();
        if(resp.status >= 200 && resp.status < 300) {
            if (resp.ok) {
                return json
            }
        } else {
            return {};
        }
        return json.then(err => {throw err});
    });
  } catch (error) {
      return null;
  }
}

注意：我调试并发现标头已正确添加到选项变量中，但由于某种原因，服务器没有收到 Authorization 标头。

我使用Postman 发送具有完全相同标头的完全相同的请求，并且我通过它得到了正确的响应。我不知道出了什么问题，除非一开始就没有发送标头。

谁能告诉我我做错了什么？谢谢！

Answer 1

headers 选项必须是Headers 的实例。您可以将当前的 headers 对象转换为 Headers 实例，方法是将其传递给它的构造函数，如下所示：

const headers = new Headers({
    'Accept': 'application/json',
    'Content-Type': 'application/x-www-form-urlencoded',
});

请注意，我还将 let 替换为 const，因为不会重新分配该变量。

要更改标头或向该Headers 实例添加新标头，您可以使用set method。而不是headers['Authorization'] = accessToken 你会这样做......

headers.set('Authorization', accessToken)