CORS 策略：Access-Control-Allow-Headers 不允许请求 header 字段令牌

Question

我正在向 api 发出 GET 类型请求，请求两次身份验证 headers，其中一个称为令牌，另一个称为身份验证。

我正在传递两个必需的参数，如下面的打印屏幕所示：

在 return 中，我得到错误：

Access to XMLHttpRequest at 'https://pay.apiname.com.br/v1/sellers/d.....2/payments/list' from origin 'http://10.0.0.150:3006' has been blocked by CORS policy: Request header field token is not allowed by Access-Control-Allow-Headers in preflight response.

我正在使用 axios 发出请求。在下面的文件中，您可以配置该特定中间件的请求。我运行这个请求甚至在必要的时候在redux动作中。

paymentApi: {
    client: axios.create({
      baseURL: process.env.API,
      responseType: 'json',
    }),
    options: {
      returnRejectedPromiseOnError: true,
      interceptors: {
        request: [
          ({ getState }, config) => {
            // here I look for the user information from the state, where it contains the authorization and token needed for the header.
            const { auth } = getState().get('login').toJS();

            return {
              ...config,
              headers: {
                ...(config.headers || {}),
                token: auth.user.token_parcela
                  ? `${auth.user.token_parcela}`
                  : undefined,
                Authorization: auth.user.api_key_parcela
                  ? `${auth.user.api_key_parcela}`
                  : undefined,
                Accept: 'application/json',
                'Content-Type': 'application/json',
              },
            };
          },
        ],
        response: [
          {
            success: (store, response) => response,
            error: (_store, error) => {
              console.error(error);
              return Promise.reject(error);
            },
          },
        ],
      },
    },
  },

奇怪的是，如果您尝试使用邮递员发出此请求，我可以毫无问题地完成，请参见下面的打印屏幕。

Answer 1

该问题与您的代码无关，API hosted/built 需要允许 CORS 来源，并且您必须指定调用此代码的网站 API作为原点。

在此处阅读有关 CORS 的更多信息 - CORS

它在 Postman 中也有效，因为 API 是直接调用的，而不是从任何 source/origin/website 调用的，这与您的代码不同。

CORS 策略：Access-Control-Allow-Headers 不允许请求 header 字段令牌

CORS policy: Request header field token is not allowed by Access-Control-Allow-Headers

api

rest

reactjs

redux

axios