在前端开发中，我们经常需要向服务器发起 HTTP 请求获取数据或者操作资源。为了简化这个过程，我们可以借助一些第三方的库来快速实现。
resource-oriented-request 是一个基于 axios 封装的 npm 包，它使用 RESTful 风格的 URL 来访问和操作资源，可以帮助我们快速实现前后端分离的应用程序。
安装
在使用该 npm 包之前，我们需要安装它。可以通过以下命令：
npm install resource-oriented-request
使用
创建实例
在使用 resource-oriented-request 时，我们需要先创建一个实例。实例可以用来定义基本的 URL 地址和请求头信息。
import { ROR } from 'resource-oriented-request'
const api = new ROR({
baseURL: 'https://www.example.com',
headers: {
'Authorization': 'Bearer ' + localStorage.getItem('token')
}
})发送请求
当我们需要向服务器发起请求，可以调用实例上的一些方法：get、post、put、patch 和 delete。
例如，如果我们需要从服务器获取用户列表：
api.get('/users')
.then(res => console.log(res.data))
.catch(e => console.log(e))如果需要创建一个新用户：
api.post('/users', { name: 'John' })
.then(res => console.log(res.data))
.catch(e => console.log(e))处理响应
在处理请求的响应时，我们通常需要对其进行一些处理，例如返回的数据格式、错误处理等。
resource-oriented-request 提供了一些选项来配置默认的响应处理：
-- -------------------- ---- -------
----- --- - --- -----
------------- ------- -- ---- ------
------------------ --------- ------ -
------ ------------------
---
--------------- -------- -------- -
------ ------ - --- -- ------ ------ -----
-
--responseType：响应数据的类型。可以是 'json'、'text'、'arraybuffer'、'blob' 或 'stream'。
transformResponse：在传递给 then 或 catch 之前，允许修改响应数据的函数数组。数组中的每个函数都将接收响应数据作为唯一参数，并返回修改后的数据。
validateStatus：定义在哪些情况下才应该处理响应。默认情况下，所有状态码在 200 到 299 的范围内都视为正常情况。你可以通过返回 true 或 false 以自定义规则。
全局拦截器
resource-oriented-request 也支持全局的拦截器，用于在请求或响应被 then 或 catch 处理之前拦截请求或响应的内容。
-- -------------------- ---- ------- ------------------------------------- -------- - -- -------------- ------------------------------- - ------- - - ----------------------------- ------ ------ -- -------- ------- - -- --------- ------ --------------------- -- -------------------------------------- ---------- - -- --------- ------------- - --------------------------- ------ -------- -- -------- ------- - -- --------- ------ --------------------- --
示例代码
以下是一个完整的例子，用于展示如何使用 resource-oriented-request 发送一个 GET 请求：
-- -------------------- ---- -------
------ - --- - ---- ---------------------------
----- --- - --- -----
-------- --------------------------
-------- -
---------------- ------- - - -----------------------------
-
--
------------------------------------- -------- -
-- --------------
------------------------------- - ------- - - -----------------------------
------ ------
-- -------- ------- -
-- ---------
------ ---------------------
--
-------------------------------------- ---------- -
-- ---------
------------- - ---------------------------
------ --------
-- -------- ------- -
-- ---------
------ ---------------------
--
-----------------
--------- -- ----------------------
-------- -- ---------------总结
resource-oriented-request 提供了一种简单和方便的方法来创建和发送 HTTP 请求。它的配置选项和拦截器可以帮助我们快速实现前后端分离的应用程序，同时还可以很容易地处理响应数据和错误。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668e0d9381d61a3540923