fetch怎么使用
fetch 是一个现代、强大的、基于 Promise 的网络请求 API，用于在浏览器中发起网络请求（如异步获取资源）。它提供了一种更加简洁和灵活的方式来替代 XMLHttpRequest。下面是 fetch 的基本使用方法和一些示例。
基本语法
fetch(url, options)
.then(response => {
// 处理响应
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json(); // 或者 response.text(), response.blob() 等，取决于你需要的数据类型
})
.then(data => {
// 处理响应数据
console.log(data);
})
.catch(error => {
// 处理错误
console.error('There was a problem with your fetch operation:', error);
});
参数
url：要请求的资源的 URL。options（可选）：一个配置项对象，用于自定义请求，比如设置请求方法（GET、POST 等）、请求头（Headers）、请求体（Body）等。
示例
GET 请求
fetch('https://api.example.com/data')
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
console.log(data);
})
.catch(error => {
console.error('Fetch error:', error);
});
POST 请求
const url = 'https://api.example.com/items';
const data = { name: 'New Item', description: 'This is a new item.' };
fetch(url, {
method: 'POST', // 或者 'PUT'
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
})
.then(response => response.json())
.then(data => console.log(data))
.catch((error) => console.error('Error:', error));
注意事项
fetch不会自动处理 JSON 转换，因此如果你期望获取 JSON 格式的数据，你需要在.then()中调用response.json()。fetch只会拒绝（reject）网络错误，而不会对 HTTP 错误状态码（如 404 或 500）进行拒绝。因此，你需要检查response.ok（等同于response.status >= 200 && response.status < 300）来确保请求成功。fetch遵循 CORS（跨源资源共享）策略，因此如果你从前端应用向不同源的服务器发送请求，需要确保服务器支持 CORS。- 默认情况下，
fetch不会发送或接收任何 cookies，也不会添加任何认证信息到请求中。如果你需要发送 cookies，需要将credentials选项设置为'include'。
fetch(url, {
credentials: 'include',
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
原文地址：https://blog.csdn.net/xuelian3015/article/details/142419372
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！