Question

我已设置axios.defaults.timeout = 1000;

我停止了为我提供API的服务器。

但发送请求后超时需要超过1秒。

这就是我的要求：

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;
      });

我也尝试过：

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

Axios没有停止提取，5-10分钟后终于显示网络错误。我知道还有其他技术可以处理超时但是为什么axios的超时功能不起作用？什么可能是axios不能停止提取的原因？

Axios version 0.9.1

修改正如评论中所提到的，我也尝试过：

import axios from 'axios';

const httpClient = axios.create();

httpClient.defaults.timeout = 500;

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

Answer 1

您需要创建axios http客户端的实例：

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

然后您可以按如下方式使用httpClient：

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

另外，您也可以在同一个配置中设置基本网址，而不是使用${ROOT_URL}：

httpClient.defaults.baseURL = ROOT_URL

Answer 2

此代码对我有用：

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);
});

如果服务器在5秒钟内没有响应，它将进入catch块。

这也很有用：#1503

Answer 3

通过此axios issue（感谢 zhuyifan2013 提供解决方案），我发现 axios timeout是响应超时而不是连接超时。

假设您已通过 axios 请求了URL，并且服务器花费了很长时间进行响应，在这种情况下， axios 超时将起作用。

但是您没有互联网连接，或者您没有要求的IP地址或域名，在这种情况下， axios 超时将无法正常工作。

您必须使用以下代码

  let source = CancelToken.source();
  setTimeout(() => {
    source.cancel();
    // Timeout Logic
  }, 10000);

  axios.get(ip + '/config', {cancelToken: source.token}).then((result) => {
    // Handle your response
  });

请注意，如果连接有效，超时逻辑模块仍将执行。

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
  }
 }

Answer 5

我在使用RN的Android上遇到了同样的问题。

我通过添加以下内容解决了该问题：

<application 
  ... 
  // add this 
  android:usesCleartextTraffic="true">

在我的AndroidManifest.xml中

好像从Android 9一样，它阻止了不在https中的任何呼叫。

Here's more info.

Answer 6

我在使用 React Native 时遇到了这个问题。解决办法是：

创建一个文件“CustomClientFactory.java”并将以下代码放在上面：

<块引用>

package <your package name>;


import com.facebook.react.modules.network.OkHttpClientFactory;
import com.facebook.react.modules.network.OkHttpClientProvider;
import com.facebook.react.modules.network.ReactCookieJarContainer;

import java.util.Arrays; 
import okhttp3.OkHttpClient;
import okhttp3.Protocol; import java.util.concurrent.TimeUnit;



public class CustomClientFactory implements OkHttpClientFactory {
    @Override
public OkHttpClient createNewNetworkModuleClient() {
    return new  OkHttpClient.Builder()
        .connectTimeout(100000, TimeUnit.MILLISECONDS)
        .readTimeout(100000, TimeUnit.MILLISECONDS)
        .writeTimeout(100000, TimeUnit.MILLISECONDS)
        .cookieJar(new ReactCookieJarContainer())
        .protocols(Arrays.asList(Protocol.HTTP_1_1))
        .build();
} }

然后在 MainApplication.java 的“onCreate”方法中添加以下代码：

<块引用>

OkHttpClientProvider.setOkHttpClientFactory(new CustomClientFactory());

您可以在以下链接中完整解释超时：

timeout in android

axios库中的超时功能无效

6 个答案: