Interceptor Firing twice.

[premdasvm]

Hi,

I've request and response interceptors implemented on my React Native app. I use the request interceptor to log the request body to the console. and I use the response interceptor for setting Authentication Token from my response header.

When I checked the interceptor is getting fired twice for all my requests and responses. I've no idea why it is doing so.

can someone help out here?

import axios from 'axios';
import { clearAsyncStorage, saveToken } from './JwtService';
import { store } from '../redux/store';
import { removeAccessToken } from '../redux/globalSlice';

const baseURL = 'http://localhost:5000/delivery';

export default class ApiService {
  static token = null;
  static referenceId = null;

  static setHeader() {
    if (!ApiService.token) return;
    axios.defaults.headers.common['Authorization'] = `Bearer ${ApiService.token}`;
    axios.defaults.headers.common['Accept'] = 'application/json';
    axios.defaults.headers.common['Content-Type'] = 'application/json';
    axios.defaults.headers.common['reference-id'] = ApiService.referenceId;

    // Axios interceptor to get new Auth token from response header and set to next requests
    axios.interceptors.response.use(x => {
      const _newAuthToken = x.headers['authorization']?.slice(7);
      if (_newAuthToken) {
        ApiService.token = _newAuthToken;
        ApiService.setHeader();
        saveToken(_newAuthToken)
      }
      return x;
    });

    axios.interceptors.request.use(x => {
      console.log(x);
      const headers = {
        ...x.headers.common,
        ...x.headers[x.method],
        ...x.headers,
      };

      ['common', 'get', 'post', 'head', 'put', 'patch', 'delete'].forEach(header => {
        delete headers[header];
      });

      const printable = `${new Date()} | Request: ${x.method.toUpperCase()} | ${x.url} | ${JSON.stringify(
        x.data,
      )} | ${JSON.stringify(headers)}`;
      console.log(printable);

      return x;
    });
  }

  static get(resource) {
    return axios.get(`${baseURL}/${resource}`);
  }

  static post(resource, params) {
    return axios.post(`${baseURL}/${resource}`, params);
  }

  static put(resource, params) {
    return axios.put(`${baseURL}/${resource}`, params);
  }

  static async handleError(error, is_login = false) {
    if (error.response) {
      switch (error.response.status) {
        case 400:
          return String(error.response.data.message);
        case 401:
          if (!is_login) {
            await clearAsyncStorage();
            store.dispatch(removeAccessToken());
          }
          return `Unauthorized`;
        case 404:
          return `Not Found.`;
        case 413:
          return `Payload too large.`;
        default:
          return `An Error has occurred.`;
      }
    } else if (error.request) {
      return error.request._response;
    } else {
      return error.message;
    }
  }

  static clearHeaders() {
    delete axios.defaults.headers.common['Authorization'];
    delete axios.defaults.headers.common['reference-id'];
    ApiService.token = null;
    ApiService.referenceId = null;
  }
}