fetch 超时时间和取消请求
时间: 2024-09-23 08:00:42 浏览: 45
`fetch()` 是 JavaScript 中的一个内置函数,用于从服务器获取资源。它支持设置超时时间以便在请求等待过长时间后自动取消。你可以通过 `AbortController` 对象来控制这个超时功能。
- **设置超时时间**:当调用 `fetch(url, options)` 时,可以传入一个包含配置的选项对象 (`options`),其中 `timeout` 属性就是用于设置超时时间。例如:
```javascript
const controller = new AbortController();
const signal = controller.signal;
setTimeout(() => {
// 如果在此时触发超时,会调用控制器的abort方法
controller.abort();
}, 5000); // 设置5秒超时
fetch('https://api.example.com/data', { signal })
.then(response => response.json())
.catch(error => {
if (error.name === 'AbortError') {
console.log('Fetch request timed out');
} else {
console.error('Other error:', error);
}
});
```
- **取消请求**:如果需要在请求过程中手动取消,可以使用 `controller.abort()` 来终止请求。上述例子中的 `signal` 就是一个可以用来取消请求的对象,如果请求期间接收到 `signal` 的中断信号,就会抛出 `AbortError` 异常。
阅读全文