如何使用JavaScript进行网络请求_fetch API和XMLHttpRequest有什么区别呢

最推荐使用 fetch API；它基于 Promise、语法简洁、支持 async/await，但需手动处理 HTTP 错误、超时和 Cookie；XHR 更底层、兼容性好、支持原生超时与进度控制，适合复杂场景。

用 JavaScript 发起网络请求，现在最推荐的方式是 fetch API；它比传统的 XMLHttpRequest（XHR） 更简洁、更符合现代 JavaScript 的设计逻辑。两者都能发请求，但写法、错误处理、默认行为和兼容性差异挺大。

fetch API：更现代、基于 Promise

fetch 是浏览器原生提供的、基于 Promise 的接口，语法干净，天然支持 async/await：

• 默认只拒绝网络错误（如断网），404、500 这类 HTTP 错误不会触发 catch，需要手动检查 response.ok 或 response.status
• 不支持原生超时控制（需配合 AbortController 实现）
• 默认不带 cookie，如需携带要显式加 credentials: 'include'
• 上传文件、发送 JSON 数据都很直观，比如：
  fetch('/api/user', { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data) })

XMLHttpRequest：更底层、回调风格

XHR 是老标准，功能全但写法冗长，依赖事件监听和回调：

标签： javascript java js json cookie 浏览器 app ai 状态码 区别 表单提交 red