React Native Axios Refresh Token Implementation When Parallel Requests
19-04-2020initAxios() { var thiz = this; Axios.defaults.baseURL = Constants.BASE_API_URL; Axios.defaults.headers.common["Authorization"] = "Bearer 123"; Axios.defaults.headers.common["Accept"] = "application/json; charset=UTF-8"; Axios.defaults.headers.common["Language"] = "TR"; //Axios.defaults.headers.common["Host"] = "localhost:44335";//todo remove in production Axios.interceptors.request.use((request: any) => { console.log("Starting Request", request.baseURL + request.url + " Params: " + JSON.stringify(request.data)); return request; }); // for multiple requests let isRefreshing = false; // @ts-ignore let failedQueue = []; const processQueue = (error: any, token = null) => { // @ts-ignore failedQueue.forEach(prom => { if (error) { prom.reject(error); } else { prom.resolve(token); } }); failedQueue = []; }; Axios.interceptors.response.use(function (response) { // Do something with response data if (response.data != null && response.data.message != null && response.data.message != "" && (response.status == 200 || response.status == 201)) { Toast.show(response.data.message, { duration: Toast.durations.SHORT, position: Toast.positions.BOTTOM, shadow: true, animation: true, hideOnPress: true, delay: 0, backgroundColor: '#62b643', textColor: '#fff', opacity: 1 }); } return response; }, function (error) { const {config, response: {status}} = error; const originalRequest = config; if (error.response.status == 401 && !originalRequest._retry) { if (isRefreshing) { return new Promise(function (resolve, reject) { failedQueue.push({resolve, reject}) }).then(token => { originalRequest.headers['Authorization'] = 'Bearer ' + token; return Axios(originalRequest); }).catch(err => { return Promise.reject(err); }) } originalRequest._retry = true; isRefreshing = true; return new Promise(function (resolve, reject) { AccessTokenHelper.createAccessTokenFromRefreshToken((token: String) => { Axios.defaults.headers.common['Authorization'] = 'Bearer ' + token; originalRequest.headers['Authorization'] = 'Bearer ' + token; // @ts-ignore processQueue(null, token); resolve(Axios(originalRequest)); isRefreshing = false }, (err: String) => { AlertHelper.showMessage('Hata', "Your session is expired. Please login again", () => { reject(err); }, "OK"); }); }); } else if (error.response) { // The request was made and the server responded with a status code // that falls out of the range of 2xx // console.log(error.response.data); // console.log(error.response.status); // console.log(error.response.headers); if (error.response.data != null && error.response.data.message != null) AlertHelper.show('Hata', error.response.data.message); } else if (error.request) { // The request was made but no response was received // `error.request` is an instance of XMLHttpRequest in the browser and an instance of // http.ClientRequest in node.js console.log(error.request); } else { // Something happened in setting up the request that triggered an Error console.log('Error', error.message); } console.log(error.config); return Promise.reject(error); }); }