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

时间:2019-06-25 02:52:33

标签: reactjs amazon-web-services cors axios internet-explorer-11

Stack:在AWS上部署的ReactJS,axios,api

在我的reactjs应用中,我正在使用axios调用在aws上部署的API。该应用程序在chrome和firefox中可以完美运行,但在IE 11中无法运行。

所有api均已正确配置为允许访问控制标头enter image description here中的授权

我正在使用以下代码在请求中添加授权标头和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);
};

当我从本地主机(3000)在chrome中运行此应用时,chrome正确调用了OPTIONS请求,然后又调用了具有正确Authorization标头的GET请求。

但是当我在IE中运行相同的应用程序时,它没有调用OPTIONS请求,也没有在GET请求中传递Authorization标头(但是它正在传递accessToken标头)。

2 个答案:

答案 0 :(得分:0)

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

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

答案 1 :(得分:0)

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