未使用接收器在Axios示例中正确添加授权标头

2ledvvac 于 2023-10-18 发布在 iOS

关注(0)|答案(1)|浏览(129)

我正在尝试使用授权（使用JWT令牌）进行Get API调用。我创建了一个单独的Axios示例，并尝试使用Axios拦截器附加授权令牌。我在尝试使用Postman和相同的令牌时获得了状态200，但从我进行API调用时获得了状态403（禁止）。
我的Axios实现是：

let Authinstance = axios.create({
    baseURL: SERVER_URL + '/api',
    headers:{
        'Access-Control-Allow-Origin': '*',
        'Content-Type':'application/json; charset=utf-8'
    }
})

Authinstance.interceptors.request.use( config => {
    const token = Auth().getToken();
    config.headers['Authorization'] =  `Bearer ${token}`;
    return config;
})

export const getPayees = async() => {
    const username = Auth().getUser();
    const res = await Authinstance.get(`/netbanking/beneficiary/${username}`)

    return res.data
}

函数Auth().getToken()只是从sessionStorage获取并返回令牌。正如你在给定的图像中看到的，我从服务器获得了403状态。enter image description here
我的直觉是我在实现Axios时做错了什么，因为我不熟悉Axios的代码流。请帮帮我

axios

来源：https://stackoverflow.com/questions/76948577/authorization-headers-not-correctly-being-added-in-axios-instance-using-inceptor

1条答案

按热度按时间

hts6caw31#

屏幕上显示的选项请求，你可以尝试把屏幕上的第二个请求.但是你可以试着这样做：

const authHeader = () => {
  Axios.interceptors.request.use(
      config => {
         const token = Auth().getToken();
        config.headers['Authorization'] =  `Bearer ${token}`;
        config.headers["Access-Control-Allow-Origin"] = "*";
        config.headers["Content-Type"] = "application/json; charset=utf-8";
        return config;
      },
      err => {
          return Promise.reject(err);
      }
  );
}

您的实现将是：

// ----- authHeader ------

let Authinstance = axios.create({
    baseURL: SERVER_URL + '/api',
    headers: authHeader(),
})

export const getPayees = async() => {
    const username = Auth().getUser();
    const res = await Authinstance.get(`/netbanking/beneficiary/${username}`)
    return res.data
}

告诉我它是否有效。

赞(0）回复(0）举报 2023-10-18

我来回答

未使用接收器在Axios示例中正确添加授权标头

1条答案

相关问题

热门标签

最新问答