简介
fetch-rest-api-wrapper 是一款基于 fetch API 的封装工具包，用于简化前端开发中 REST API 的调用过程。该工具包提供了一系列的函数和类，可以轻松进行 REST API 的调用和处理。
在本篇文章中，我们将详细介绍如何使用 fetch-rest-api-wrapper 这个 npm 包，并提供实例代码进行演示。
安装
在开始使用 fetch-rest-api-wrapper 前，需要先安装该 npm 包。可以通过以下命令进行安装：
npm install fetch-rest-api-wrapper
使用方法
创建实例
首先需要创建一个 fetch-rest-api-wrapper 的实例，用于后续的 REST API 调用。实例化时需要传入 REST API 的基本信息：
-- -------------------- ---- -------
------ - ------- - ---- -------------------------
----- --- - --- ---------
-------- -------------------------
-------- -
--------------- -------------------
-------------- ------- ----------
--
---以上代码创建了一个名为 api 的实例，基本信息包括 API 的基本路径 baseUrl 和头部信息 headers。所有发送请求时都会将 baseUrl 和 headers 加到请求中（如果配置了的话）。
发送请求
fetch-rest-api-wrapper 提供了多个方法，用于发送不同类型的请求，包括 GET、POST、PUT、DELETE 等。以下是具体的调用方式：
-- -------------------- ---- ------- -- --- -- ----- -------- - ----- ------------------ ---------------------- -- ---- -- ----- ---- - - ----- ----- ---- -- -- ----- -------- - ----- ------------------ ------ ---------------------- -- --- -- ----- ---- - - ----- ----- ---- -- -- ----- -------- - ----- ------------------- ------ ---------------------- -- ------ -- ----- -------- - ----- ----------------------- ----------------------
可以看到，以上代码分别发送了 GET、POST、PUT、DELETE 四种类型的请求，并将响应结果打印到控制台上。
处理响应
在发送请求后，可以对响应结果进行处理，以满足需要。fetch-rest-api-wrapper 提供了一些函数，用于处理常见的响应结果，包括将响应结果转换为 JSON 格式、获取指定的响应头、获取响应状态码等。
以下是具体的调用方式：
-- -------------------- ---- ------- -- -- ---- -- ----- -------- - ----- ------------------ ----- ---- - ---------------- ------------------ -- -------- ----- -------- - ----- ------------------ ----- ------- - ---------------------- ------------------------------------- -- ------- ----- -------- - ----- ------------------ ----- ------ - --------------------- --------------------
以上代码分别使用 json()、getHeaders() 和 getStatus() 方法，用于处理响应结果。
示例代码
完整示例代码如下：
-- -------------------- ---- -------
------ - ------- - ---- -------------------------
----- --- - --- ---------
-------- -------------------------
-------- -
--------------- -------------------
-------------- ------- ----------
--
---
-- --- --
----- -------- - ----- ------------------
----------------------
-- ---- --
----- ---- - - ----- ----- ---- -- --
----- -------- - ----- ------------------ ------
----------------------
-- --- --
----- ---- - - ----- ----- ---- -- --
----- -------- - ----- ------------------- ------
----------------------
-- ------ --
----- -------- - ----- -----------------------
----------------------
-- -- ---- --
----- -------- - ----- ------------------
----- ---- - ----------------
------------------
-- --------
----- -------- - ----- ------------------
----- ------- - ----------------------
-------------------------------------
-- -------
----- -------- - ----- ------------------
----- ------ - ---------------------
--------------------结束语
fetch-rest-api-wrapper 是一款非常实用的工具包，可以帮助前端开发人员更轻松地进行 REST API 调用和处理。在使用时，需要注意传入正确的基本信息，并合理处理响应结果以满足需要。
希望本文对您有所帮助，感谢您的阅读。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600572ce81e8991b448e903c