javascript - 如何在 JavaScript 中正确分配 header 以获取请求

Question

我对更高级的 API 还很陌生，我正在尝试使用 fetch 向外部 API 发送 GET 请求，并使用 API 所有者详细说明的相应 header 。

但是，我仍然收到 403 Forbidden 错误，并且 header 实际上并未随请求一起发送，如 Chrome DevTools 所示:

"Provisional headers are being shown".

我正在使用 CORS 代理:https://cors-anywhere.herokuapp.com/ ，它已与其他更简单的 API 请求一起使用。

const proxy = 'https://cors-anywhere.herokuapp.com/';
const api = `${proxy}https://api-example.com`; // Obfuscated


// Generate the data
fetch(api, data = {}, {
    credentials: "include",
    method: "GET",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
      Authorization: "Bearer eLrw3eXlljyFRjaul5UoYZLNgpUeapbXSFKmLc5SVaBgv8azUtoKn7B062PjbYoS",
      "User-Agent": "any-name"
    },
    body: JSON.stringify(data)
})
    .then(response => {
        return response.text();
    })

API 请求在 Postman 中工作并使用curl，但在我的应用程序中我收到 403 Forbidden 响应。如上所述，请求 header 中仅显示临时 header ；我没有设置任何标题。

任何帮助将不胜感激。

Answer 1

看起来好像您正在传递一个空对象作为选项。 fetch() 函数仅采用两个参数，即资源 (uri) 和选项对象(请参阅: https://developer.mozilla.org/en-US/docs/Web/API/fetch )。您有一个空对象 data = {} 作为第二个参数，并且您的选项指定为未使用的第三个参数。我相信您想要的是删除 data 参数，特别是因为您不需要在 GET 请求中发送 body 。

fetch(api, {
    credentials: "include",
    method: "GET",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
      Authorization: "Bearer eLrw3eXlljyFRjaul5UoYZLNgpUeapbXSFKmLc5SVaBgv8azUtoKn7B062PjbYoS",
      "User-Agent": "any-name"
    }
})
.then(response => {
    return response.text();
})