Web 开发中客户端与服务器间的交互非常重要,它有利于客户端应用高度动态化。用户通过单击按钮的交互方式向服务器发送请求,服务器检索数据并返回,页面无需重新加载,直接使用返回的数据重新渲染其部分/整体内容,或者对数据进行操作。这其中的技术原理是 AJAX,通过 XMLHttpRequest 实例实现。 为了提升 AJAX 及 XMLHttpRequest 的使用体验,社区开发了一些无需处理 AJAX 和 XMLHttpRequest 就直接发出 HTTP 请求的库。本文将带你研究 5 个最流行的 HTTP 库,了解它们是如何实现的。
Axios
Axios 是一个基于 Promise 的 HTTP 库,可用在 Node.js 和浏览器上发起 HTTP 请求,支持所有现代浏览器,甚至包括 IE8+!
优点
1、无序列表同时支持 Node.js 和浏览器
2、支持 Promise API
3、可以配置或取消请求
4、可以设置响应超时
5、支持防止跨站点请求伪造(XSRF)攻击
6、可以拦截未执行的请求或响应
7、支持显示上传进度
8、广泛用于 React 和 Vue 项目
缺点
1、用起来比较麻烦
Superagent
Superagent 是一个基于 Promise 的轻量级渐进式 AJAX API,非常适合发送 HTTP 请求以及接收服务器响应。 与 Axios 相同,它既适用于 Node,也适用于所有现代浏览器。
优点
1、它有一个插件生态,通过构建插件可以实现更多功能
2、表可配置
3、HTTP 请求发送接口友好
4、可以为请求链式添加方法
5、适用于浏览器和 Node
6、支持显示上传和下载进度
7、表支持分块传输编码
8、支持旧风格的回调
9、繁荣的插件生态,支持众多常见功能
缺点
1、其 API 不符合任何标准
Request
Request 提供了一种简化的 HTTP 请求方式。 你可以使用比其他 HTTP 库更少的代码来发起 HTTP 请求。 它不是基于 Promise 的,但如果你需要 Promise,你可以引入request-promise 库,将请求封装为 Promise 并返回。
优点
1、API 简单易用
缺点
1、不基于 Promise
Fetch
Fetch 是浏览器自带的用于发送请求的 API,旨在替代 XMLHttpRequest。
优点
1、无序列表灵活易用
2、无序列表使用 Promise 避免回调地狱
3、无序列表支持所有现代浏览器
4、无序列表遵循 request-response 方案
5、无序列表语法简单清晰
6、无序列表支持 React Native
缺点
1、无序列表不支持服务器端使用
2、无序列表缺乏开发库的亮点功能,比如取消请求
3、没有内置默认值,如请求模式,请求头,请求凭据。
Supertest
Supertest 用于测试 Node.js HTTP 服务器。 该库由 SuperAgent 提供支持,它把自身的 API 和 SuperAgent 的底层 API 相结合,提供简洁的 HTTP 测试接口。
优点
1、流畅的 API
2、简单的 HTTP 断言
3、可以与 Chai.js 和 Mocha 等不同的测试套件混用
缺点
1、不支持浏览器
总结
选择哪个库取决于你的项目、规模和目标用户,每个选择都有好有坏。 如果你为误判规格选择了错误的库,那就得考虑下这个问题,重新选择合适的工具。