Debugging Axios Requests: How to Log API Interactions in JavaScript

When working with APIs in your Javascript application it can be useful to be able to debug the requests and responses you're using to interact with the API.

Axios comes with a feature called interceptors that allow you to run some code before a request and after a response. This is a good place to add some code that runs on every request, you can put your debug messages in here.

axios.interceptors.request.use(request => {
    console.log('Starting Request', JSON.stringify(request, null, 2))
    return request
})

axios.interceptors.response.use(response => {
    console.log('Response:', JSON.stringify(response, null, 2))
    return response
})

Now when you use axios to make requests to apis you'll get debug messages for each request and response.