error.response.data не определен при использовании axios interceptors.request

Question

Я использую "axios": "^ 0.18.0"

Я перехватываю запросы и ответы и добавляю токен , когда перехватываю запросы .

когда я использую перехватчик запросов, то в перехватчик ответов , если я получаю ошибку [400, ...], моя " error.response.data " не определена иУ меня нет доступа к типам исключений и сообщениям для их перевода

, когда я удаляю перехватчик запросов, он работает правильно, но мне нужен перехватчик запросов, чтобы добавить токен

axiosAuthInstance.interceptors.request.use((config)=>{
    console.log('Auth req config=>', config.url);
    console.log('auth req ',config);

    const token = store.getState().tokenReducer.access_token;
    console.log(token);
    if (token != null || token !== '.') {
        config.headers.Authorization = `Bearer ${token}`;
        console.log('authed');
    }
    return config;
},(error)=>{
    ToastMaker().withoutAction('Ooops Error in Auth Request Interceptor','warning');
    console.log(error);
    return Promise.reject(error);
});
//------------------------------------------
axiosAuthInstance.interceptors.response.use((response)=>{
    console.log('Auth resp response=>',response);
    if (response.data.error) {
        console.log('hereeeeeee !!!');
        // return Promise.reject(response);
    }
    return response;
},(error)=>{
    switch(error.response.status){
        case 400:{
            console.log(error.response.data.customExceptionDetailModelList);
            error.response.data.customExceptionDetailModelList.forEach((item)=>{console.log(item.message.error)});
            ToastMaker().withoutAction(`${error.response.status}` + " "+error.response.data.error_description,'warning');
            break;
        }

        case 401:{
            console.log('shafffft');
            console.log(error.response.data.customExceptionDetailModelList);
            error.response.data.customExceptionDetailModelList.forEach((item)=>{console.log(item.message.error)});
            ToastMaker().withoutAction(`${error.response.status}` +" "+error.response.data.error_description,'warning');
            break;
        }

        case 404:{
            console.log(error.response.data.customExceptionDetailModelList);
            error.response.data.customExceptionDetailModelList.forEach((item)=>{console.log(item.message.error)});
            ToastMaker().withoutAction(`${error.response.status}` + " "+error.response.data.error_description,'warning');
            break;
        }

        case 500:{
            ToastMaker().withoutAction(`${error.response.status}` +" "+error.response.data.error_description,'warning');
            break;
        }

        default:{
            ToastMaker().withoutAction('مشکل ارتباط با سرور','warning');
            break;
        }
    }
    console.log(error.response);
    return Promise.reject(error);
});

вот как это работаетбез request.intercept

и вот как это выглядит после использования перехватчика запроса

Answer 1

проблема заключалась в добавлении «Нулевого канала» к заголовкам.

const token = store.getState().tokenReducer.access_token;
if (token != null) {
    config.headers.Authorization = `Bearer ${token}`;
}
return config;

удаление, если оператор решил проблему.неправильные заголовки давали мне неправильные коды ошибок

Answer 2

По моему опыту, error.response не определяется, когда сервер (по некоторым причинам) не отвечает (например, время ожидания). Поэтому вы не получите ни кода состояния, ни сообщения об ошибке.

Я обычно справляюсь с обеими ситуациями:

axios.interceptors.response.use(response => {
  return response
}, error => {
  if (!error.response) {
    // Show a generic error Toast (e.g. Server error, please retry)
    return
  }

  const { response: { status } } = error
  if (status === 401) {
    // Refresh token
  }
  return Promise.reject(error)
})