How can I cancel a fetch or axios request?

How can I cancel a fetch or axios request?

You can cancel requests in Axios using a CancelToken. For Fetch, you can use the AbortController.

Can you show me an example of using CancelToken in Axios?

Sure! Here's a simple example:

const axios = require('axios');
const CancelToken = axios.CancelToken;
let cancel;

axios.get('/some/endpoint', { cancelToken: new CancelToken(function executor(c) {
  cancel = c;
})}).then(function (response) {
  console.log(response.data);
}).catch(function (thrown) {
  if (axios.isCancel(thrown)) {
    console.log('Request canceled', thrown.message);
  } else {
    // handle error
  }
});

// To cancel the request:
cancel('Operation canceled by the user.');

What about cancelling a fetch request?

For Fetch, you can use the AbortController like this:

const controller = new AbortController();
const signal = controller.signal;

fetch('/some/endpoint', { signal })
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(err => {
    if (err.name === 'AbortError') {
      console.log('Fetch request canceled');
    } else {
      // handle error
    }
  });

// To cancel the request:
controller.abort();