fetch()默认发起get请求,返回promise需手动检查response.ok;推荐用urlsearchparams处理参数,注意cors、响应体单次读取及超时需abortcontroller实现。

直接用 fetch() 调用 URL 即可发送基础 GET 请求,它默认就是 GET 方法,无需额外配置。
基本写法
最简形式只需传入一个 URL 字符串:
-
fetch('https://api.example.com/data')就会发起一个无参、无头信息的 GET 请求 - 返回的是一个 Promise,需用
.then()或async/await处理响应 - 注意:
fetch不会因 HTTP 状态码(如 404、500)自动 reject,需手动检查response.ok
完整示例(含错误处理)
推荐写法,兼顾可读性和健壮性:
async function getData() {
try {
const response = await fetch('https://jsonplaceholder.typicode.com/posts/1');
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
console.log(data);
} catch (err) {
console.error('请求失败:', err.message);
}
}
带查询参数的 GET 请求
不要手动拼接字符串,推荐用 URLSearchParams 构建安全的查询字符串:
const params = new URLSearchParams({ id: 1, type: 'public' });fetch(`/api/items?${params}`)- 这样能自动处理编码(比如空格 →
%20),避免手拼出错
常见注意事项
几个容易忽略但关键的点:
- CORS 限制:跨域请求时,目标服务器必须返回合法的
Access-Control-Allow-Origin响应头 - 响应体只能读取一次:调用
response.json()或response.text()后,不能再重复读取 - 超时需手动实现:Fetch 本身不支持 timeout 选项,可用
AbortController控制
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!











