I have an app in react.
I setup redux-obsrrvable
and axios-observable
.
I face a problem when my request is unauthorized.
Using the following code =>
const getWorkspaces = (action$, state$) => action$.pipe(
ofType(WorkspaceActions.getWorkspacesRequest),
switchMap(action =>
HttpService.GetAsync<any>('get_all_workspaces').pipe(
map(response => {
console.log(response)
let data = response.data ? response.data : [];
return of(WorkspaceActions.getWorkspacesSuccess(data));
}),
catchError((error: string) => {
console.log(error)
return of(WorkspaceActions.getWorkspacesFailed({error}));
})
)
)
);
The api return an error 401, but the redux effect goes inside the map and not the catchError. I believe an Error 401 is considerer an error and should go into the catchError.
Am I using something wrongly ?
EDIT :
I have already setup the following
Axios.interceptors.response.use(response => {
console.log(`[response] --> ${response.status}`)
return response;
}, error => {
if(error && error.response) {
console.log(error.response)
console.log(`[error][code: ${error.response.status}] -->> ${error.response}`);
}
return error;
})
and here it does go in the error, but an when I use
class HttpService {
// apicoreBaseUrl define apicore base url from env
private static apicoreBaseUrl = (targetApi: string, basePath: string = "hexacloud"): string => {
return `/${basePath}/${targetApi}`
}
// Get common http get function
public static GetAsync<T>(targetApi: string, params?: any, basePath?: string): AxiosObservable<T> {
return Axios.get(this.apicoreBaseUrl(targetApi, basePath), { params: params })
}
public static PostAsync<T>(targetApi: string, data: any, basePath?: string): AxiosObservable<T> {
return Axios.post(this.apicoreBaseUrl(targetApi, basePath), data);
}
}
the returner observable fo not go on the catch