最常用、最推荐的JavaScript网络请求方式是fetch() API。它基于Promise、原生支持、简洁高效;支持GET/POST等方法,需手动处理HTTP错误和凭证配置;相比XMLHttpRequest更现代,推荐新项目使用。

用 JavaScript 发起网络请求,最常用、最推荐的方式是使用 fetch() API。它简洁、基于 Promise、原生支持,无需额外库。
基础用法:GET 请求
发起一个简单的 GET 请求,获取 JSON 数据:
- 调用 fetch(url),返回一个 Promise
- 用 .then() 处理响应,注意 response.json() 也返回 Promise
- 记得用 .catch() 捕获网络错误(注意:404、500 等 HTTP 错误不会进 catch,需手动检查 response.ok)
.then(response => {
if (!response.ok) throw new Error(`HTTP ${response.status}`);
return response.json();
})
.then(data => console.log(data))
.catch(err => console.error('请求失败:', err));
发送 POST 请求(带数据)
提交表单或调用接口时常用 POST。关键点:
- 设置 method: 'POST'
- 用 headers 声明内容类型,如 'Content-Type': 'application/json'
- 用 body 传数据,JSON 需先 JSON.stringify()
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
title: '我的标题',
body: '我的内容',
userId: 1
})
})
.then(res => res.json())
.then(console.log);
处理 Cookie 和认证(如登录态)
默认 fetch 不发送 Cookie,跨域时也不携带凭证。需要显式配置:
动态WEB网站中的PHP和MySQL详细反映实际程序的需求,仔细地探讨外部数据的验证(例如信用卡卡号的格式)、用户登录以及如何使用模板建立网页的标准外观。动态WEB网站中的PHP和MySQL的内容不仅仅是这些。书中还提到如何串联JavaScript与PHP让用户操作时更快、更方便。还有正确处理用户输入错误的方法,让网站看起来更专业。另外还引入大量来自PEAR外挂函数库的强大功能,对常用的、强大的包
立即学习“Java免费学习笔记(深入)”;
- 同域请求加 credentials: 'same-origin' 可发 Cookie
- 跨域请求需同时设 credentials: 'include',且服务端必须允许(CORS 响应头含 Access-Control-Allow-Credentials: true)
- 带 Token 认证?直接在 headers 里加 Authorization
credentials: 'include',
headers: {
'Authorization': 'Bearer abc123'
}
});
替代方案:XMLHttpRequest(不推荐新项目用)
XMLHttpRequest 是传统方式,兼容性好但写法冗长、回调嵌套深。除非要支持 IE11 或特殊流式处理,否则优先选 fetch。
基本上就这些。fetch 覆盖绝大多数场景,配合 async/await 写起来更清晰。需要上传文件、进度监听或取消请求?可以进一步封装或搭配 AbortController 使用。









