IE 11 未在 API 调用中传递授权标头

Question

堆栈：部署在 AWS 上的 ReactJS、axios、api

在我的 reactjs 应用程序中，我正在使用 axios 调用部署在 aws 上的 API。此应用在 chrome 和 firefox 中运行良好，但在 IE 11 中失败。

所有 api 均已正确配置为允许在访问控制标头 中进行授权

我正在使用下面的代码在请求中添加授权标头和 accessToken

   const axiosInstance = axios.create({
  baseURL: `https://abc.api.nonprod.org/`
});

export const createTokenHeaders = (idToken, accessToken) => ({
  authorization: `Bearer ${idToken}`,
  accessToken: `Bearer ${accessToken}`
});
// Add a request interceptor
export const reqInterceptor = config =>
  // get the bearer token and add it in the header
  Auth.currentSession()
    .then(data => {
      const idToken = data.getIdToken().getJwtToken();
      const accessToken = data.getAccessToken().getJwtToken();
      // eslint-disable-next-line no-param-reassign
      config.headers = Object.assign({}, config.headers, createTokenHeaders(idToken, accessToken));
      return config;
    })
    .catch(err => {
      console.log(err);
      throw new Error('Error getting bearer token');
    });

axiosInstance.interceptors.request.use(reqInterceptor);

export const performGet = (uri, queryParams = {}, headers) => {
  const requestParams = {
    params: queryParams,
    headers
  };
  return axiosInstance.get(uri, requestParams);
};

当我从 localhost:3000 在 chrome 中运行此应用程序时，chrome 正确调用 OPTIONS 请求，然后使用正确的 Authorization 标头获取请求。

但是当我在 IE 中运行同一个应用程序时，它没有调用 OPTIONS 请求，也没有在 GET 请求中传递 Authorization 标头（但是它正在传递 accessToken 标头）。

Answer 1

您的 IE 是否在增强保护模式下运行？ 这似乎不是代码问题。 https://www.npmjs.com/package/react-native-axios

react-native-axios 支持 IE11。 使用 f12 调试器并检查网络流量中未找到的 url。

Answer 2

您可能需要设置 withCredentials: true 才能将授权标头传递给 CORS 请求。