middleware-axios

import { create } from 'middleware-axios'; import type { AxiosResponse } from 'axios'; // Create a wrapped Axios instance, similar to a normal axios.create() const api = create({ baseURL: 'https://jsonplaceholder.typicode.com', timeout: 5000, }); // Add a middleware to log requests and responses api.use(async (config, next, defaults) => { console.log(`[REQUEST] ${config.method?.toUpperCase()} ${config.url}`); console.log(' Base URL from defaults:', defaults.baseURL); // Crucially, await next(config) passes control to the next middleware or Axios itself await next(config); // This code runs after the response is received const response: AxiosResponse = await config.axiosData; // Access the response data from the config console.log(`[RESPONSE] ${config.method?.toUpperCase()} ${config.url} - Status: ${response.status}`); // console.log(' Response Data:', response.data); }); // Use the wrapped instance like a normal Axios instance api.get('/todos/1') .then(response => { console.log('\n--- API Call Successful ---'); console.log('Todo Title:', response.data.title); console.log('Response Status:', response.status); }) .catch(error => { console.error('\n--- API Call Failed ---'); if (error.response) { console.error('Error Status:', error.response.status); console.error('Error Data:', error.response.data); } else if (error.request) { console.error('No response received:', error.request); } else { console.error('Error message:', error.message); } }); // You can also access the pure Axios instance if needed // console.log(api.axiosInstance);