1
npm i axios

1
import axios from 'axios';
2
import { BASE_URL } from '../env';
3

4
// Utility function to retrieve the token
5
const getToken = () => localStorage.getItem('authToken');
6

7
// Create an Axios instance with default configurations
8
const request = axios.create({
9
  baseURL: BASE_URL, // Set the base API URL
10
  withCredentials: true, // Enable cross-origin requests with credentials
11
  headers: {
12
    'Content-Type': 'application/json',
13
  },
14
});
15

16
// Request Interceptor: Attaches Authorization token to every request
17
request.interceptors.request.use(
18
  (config) => {
19
    const token = getToken();
20
    if (token) {
21
      config.headers['Authorization'] = `Bearer ${token}`;
22
    }
23
    return config;
24
  },
25
  (error) => Promise.reject(error)
26
);
27

28
// Response Interceptor: Handles API response and errors
29
request.interceptors.response.use(
30
  (response) => response, 
31
  (error) => handleErrorResponse(error)
32
);
33

34
// Function to handle error responses
35
const handleErrorResponse = (error) => {
36
  if (!error.response) {
37
    console.error('❌ Network error or no response received:', error);
38
    return Promise.reject({ message: 'Network Error', error });
39
  }
40

41
  const { status } = error.response;
42
  const currentPath = window.location.pathname;
43

44
  switch (status) {
45
    case 401: // Unauthorized - Clear token and redirect to home
46
      console.warn('⚠️ Unauthorized request (401) - Redirecting to login...');
47
      localStorage.removeItem('authToken');
48
      if (currentPath !== '/') window.location.href = '/';
49
      break;
50

51
    case 429: // Too Many Requests - Retry mechanism (optional)
52
      console.warn('⚠️ Too Many Requests (429) - Consider retrying...');
53
      break;
54

55
    case 500: // Internal Server Error
56
      console.error('🔥 Server Error (500):', error.response.data);
57
      break;
58

59
    default:
60
      console.error(`⚠️ API Error (${status}):`, error.response.data);
61
      return Promise.reject(error);
62
  }
63
};
64

65
export default request;

1
import request from './axios';
2

3
const getUser = async () => {
4
    try {
5
        const response = await request.get('/api/users');
6
        return response.data; // Ensure the function returns useful data
7
    } catch (error) {
8
        console.error('Error fetching user:', error);
9
        throw error; // Re-throw to allow calling function to handle it
10
    }
11
};