Axios library timeout function not working

Question

I set axios.defaults.timeout = 1000;

I stopped the server that provides me the API.

But after sending the request, the wait time exceeds 1 s.

This is what my query looks like:

 import axios from 'axios'; axios.defaults.timeout = 1000; return axios.post('${ROOT_URL}/login/${role}', creds).then((response) => { console.log(response); if(response.status === 200) { // If login was successful, set the token in local storage localStorage.setItem('${role}_log_toks', JSON.stringify(response.data)); // Dispatch the success action dispatch(receiveLogin(response.data)); return response; } }).catch(err => { console.log(err); // If there was a problem, we want to // dispatch the error condition if(err.data && err.status === 404) { dispatch(loginError(err.data)); } else { dispatch(loginError('Please check your network connection and try again.')); } return err; }); 

I also tried:

 return axios.post('${ROOT_URL}/login/${role}', creds, {timeout: 1000}).then... 

Axios does not stop sampling and after 5-10 minutes finally shows a network error. I understand that there are other timeout processing methods, but why does the timeout function in axios not work? What could be the reason that Axios does not stop receiving?

Axios version 0.9.1

EDIT: As mentioned in the comments, I also tried:

 import axios from 'axios'; const httpClient = axios.create(); httpClient.defaults.timeout = 500; return httpClient.post('${ROOT_URL}/login/${role}', creds) .then(handleResponse) 

Answer 1

You need to create an axios http client instance:

 const httpClient = axios.create(); httpClient.defaults.timeout = 500; 

Then you can use httpClient as follows:

 return httpClient.post('${ROOT_URL}/login/${role}', creds) .then(handleResponse) 

Alternatively, you can set the base URL in the same configuration instead of using ${ROOT_URL} :

 httpClient.defaults.baseURL = ROOT_URL 

Answer 2

From this axios problem (thanks to zhuyifan2013 for the provided solution), I found that axios timeout time is the response timeout time , not the connection timeout.

Suppose you requested a URL through axios, and it takes a long time for the server to respond, in which case the axios timeout will work.

But you do not have an Internet connection or the IP address or domain name that you are requesting is not there, in which case the Axios timeout will not work.

You should use the following code

  let source = CancelToken.source(); setTimeout(() => { source.cancel(); // Timeout Logic }, 10000); axios.get(ip + '/config', {cancelToken: source.token}).then((result) => { // Handle your response }); 

Note that if you have a valid connection, the Timeout Logic block will still be executed.

Answer 3

This code works for me:

 axios({ method: "post", url: 'http://example.com/api', timeout: 1000 * 5, // Wait for 5 seconds headers: { "Content-Type": "application/json" }, data: { id: 1234 } }) .then(response => { const serverResponse = response.data; // do sth ... }) .catch(error => { console.log(error); }); 

If the server does not respond within 5 seconds, it goes to the catch block.

It is also useful: # 1503

Answer 4

 submitHashtag = async () => { const data = await axios.post('/pwa/basics.php', { withCredentials: true,// if user login timeout: 30000 }) if (!data) { // action here alert('reload window') return } }