uniapp请求超过十秒如何取消或设置超时时间

在uniapp开发中，网络请求超过10秒时如何自动取消或设置超时时间？目前使用uni.request()发送请求，但长时间未响应时会一直等待。请问如何配置请求超时参数，或者通过AbortController等方案实现主动取消请求的功能？需要兼容H5和小程序平台的具体实现方法。

2 回复

在uniapp中，设置请求超时时间可以在uni.request的timeout参数中配置，单位毫秒。例如设置5秒超时：

uni.request({
  url: '...',
  timeout: 5000,
  success() {...},
  fail(err) {...}
})

如需手动取消请求，可使用AbortController：

const controller = new AbortController()
uni.request({
  signal: controller.signal,
  // ...其他参数
})
// 取消请求
controller.abort()

注意：部分低版本小程序可能不支持AbortController。


在 UniApp 中，可以通过以下方法设置请求超时时间或取消请求：

1. 使用 uni.request 的 timeout 参数设置超时时间

uni.request({
  url: 'https://example.com/api',
  method: 'GET',
  timeout: 10000, // 设置超时时间为10秒（单位：毫秒）
  success: (res) => {
    console.log('请求成功', res);
  },
  fail: (err) => {
    console.log('请求失败', err);
    if (err.errMsg.includes('timeout')) {
      console.log('请求超时');
    }
  }
});

2. 手动取消请求（使用 AbortController）

let controller = new AbortController();

// 发起请求
uni.request({
  url: 'https://example.com/api',
  signal: controller.signal, // 传入AbortSignal
  success: (res) => {
    console.log('请求成功', res);
  },
  fail: (err) => {
    console.log('请求失败', err);
  }
});

// 在需要取消时调用
setTimeout(() => {
  controller.abort(); // 取消请求
  console.log('请求已取消');
}, 5000); // 5秒后取消

3. 封装请求函数实现超时控制

function requestWithTimeout(url, options = {}, timeout = 10000) {
  return new Promise((resolve, reject) => {
    const timer = setTimeout(() => {
      reject(new Error('请求超时'));
    }, timeout);

    uni.request({
      url,
      ...options,
      success: (res) => {
        clearTimeout(timer);
        resolve(res);
      },
      fail: (err) => {
        clearTimeout(timer);
        reject(err);
      }
    });
  });
}

// 使用示例
requestWithTimeout('https://example.com/api', { method: 'GET' }, 10000)
  .then(res => console.log('成功', res))
  .catch(err => console.log('失败', err));

注意事项：

  • timeout 参数在 UniApp 2.8.0+ 版本支持
  • 部分低版本小程序平台可能不支持 AbortController，建议先检查兼容性
  • 超时后会自动触发 fail 回调，可通过 err.errMsg 判断是否为超时

推荐使用第一种方法设置 timeout 参数，简单直接且兼容性较好。

回到顶部