我有一个Axios拦截器设置,用于管理响应并减少在任何地方的代码重写。当前,我需要在每个调用中使用Authorization
对象添加{ config }
header ,如下所示。
apiCall = () => {
const token = await AsyncStorage.getItem('JWT_BEARER_TOKEN');
const config = {
headers: {
'Authorization': 'Bearer ' + token,
}
}
const attendance = await axiosInstance.post('/team/matchday', data, config);
// ... do something with attendance
}
我想在下面创建的
axiosInstance
中执行此操作,但出现了Promise拒绝错误。我认为这是因为token
返回时仍然是一个不完整的 promise 。任何想法如何正确处理此配置?
import { AsyncStorage, Alert } from 'react-native';
import axios from 'axios';
const ReturnAxiosInstance = async (token) => {
const AxiosInstance = axios.create({
baseURL: 'http://localhost:4000',
timeout: 3000,
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + await AsyncStorage.getItem('JWT_BEARER_TOKEN'),
},
});
AxiosInstance.interceptors.response.use(
response => response,
(error) => {
if (!error.response) {
Alert.alert('Network Error!');
return console.log(error);
// return dispatch({ type: 'NETWORK_FAILURE' });
} else if (error.response.status === 500) {
Alert.alert('Server Error!');
} else if (error.response.status === 404) {
Alert.alert('Endpoint doesn\'t exist!');
}
// handle the errors due to the status code here
return error.response;
},
);
return AxiosInstance;
};
export default ReturnAxiosInstance();
最佳答案
您需要为Axios实例添加request interceptor
。
// ...
axiosInstance.interceptors.request.use(
async (config) => {
config.headers.authorization = await AsyncStorage.getItem('JWT_BEARER_TOKEN');
return config;
},
error => Promise.reject(error)
);
// ...
关于react-native - Axios拦截器-在解决AsyncStorage之前不使用实例吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49878926/