reqwest 是一个基于 XMLHttpRequest 封装的简单、易用的跨域 Ajax 库,适用于浏览器和 Node.js 环境。它支持 Promise 和 async/await,而且功能强大,能够满足前端开发中大部分的数据请求需求。
安装和使用
使用 npm 安装 reqwest:
npm install reqwest --save
在需要发送请求的模块中导入 reqwest:
import reqwest from 'reqwest';
发送 GET 请求
发送 GET 请求时,可以将查询参数作为对象传递给 reqwest
函数:
-- -------------------- ---- ------- --------- ---- ------------------------------- ------- ------ ----- - ----- -- ------ -- -- -------- -------------- - ------------------ -- ------ ------------- - ------------------- - ---
上面的例子会向 https://api.example.com/data?page=1&limit=10
发送 GET 请求,并在成功或失败时输出响应或错误信息。
发送 POST 请求
发送 POST 请求时,可以将请求体作为对象传递给 reqwest
函数:
-- -------------------- ---- ------- --------- ---- ------------------------------- ------- ------- ----- - ----- ----- ----- ---- -- -- -------- -------------- - ------------------ -- ------ ------------- - ------------------- - ---
上面的例子会向 https://api.example.com/data
发送 POST 请求,并将请求体设置为 { "name": "John Doe", "age": 30 }
。
Promise 和 async/await 支持
reqwest 支持 Promise 和 async/await,可以使用这两种方式发送请求,而不需要显式地传递回调函数。
-- -------------------- ---- ------- -- -- ------- -- --- -- --------- ---- ------------------------------- ------- ------ ----- - ----- -- ------ -- - -- -------------------- - ------------------ -- -------------------- - ------------------- --- -- -- ----------- -- ---- -- ----- -------- ---------- - --- - ----- ---- - ----- --------- ---- ------------------------------- ------- ------- ----- - ----- ----- ----- ---- -- - --- ------------------ - ----- ----- - ------------------- - - -----------
配置选项
除了上面介绍的几个配置选项外,reqwest 还支持其他一些常用的选项:
- headers:请求头对象。
- contentType:请求的内容类型。
- crossOrigin:是否允许跨域请求。
- withCredentials:是否发送身份验证信息。
- timeout:请求超时时间(毫秒)。
- xhrFields:原生 XMLHttpRequest 对象的属性和方法。
总结
本文介绍了 npm 包 reqwest 的基本使用方法,希望能够对前端开发者有所帮助。reqwest 是一个功能强大、易用的 Ajax 库,可以大大简化前端数据请求的过程。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/34056