Desc/概述

通过 fetch 的封装的前端请求, 可以通过实例化来传入错误提示, 加载动画等。 By encapsulating frontend requests with fetch, it is possible to instantiate and include features such as error prompts and loading animations.

当前更新

install/安装

npm i json_lee_fetch

或

yarn add json_lee_fetch

Instance Options

baseURL: string // 和axios的baseURL一样; Same as axios's baseURL.
headers: Record<string, string> // 公共的headers; 公共的headers
timeout: number // 设置请求超时, 单位为毫秒 Set request timeout in milliseconds.
proxies: object // 这并非真的做代理, 只是为了前端方便代理后的重写, 值为对象,键名为重写后的值, 键值是被替换的url, 例如: {'api': 'http://127.0.0.1:3000'}; This is not actually acting as a proxy, but rather for the convenience of rewriting the proxied URL in the frontend. The value should be an object, where the key represents the rewritten value and the value represents the replaced URL. For example: {'api': 'http://127.0.0.1:3000'}.
useProxy: boolean // 用于判断是否需要通过proxies重写请求地址, 使用场景为前端代理后为测试环境就需要重写, 例如vite的代理后传入import.meta.env.DEV或者webpack的代理后传入process.env.NODE_ENV === 'development'即可; Used to determine whether the request address needs to be rewritten through proxies. This is typically used in scenarios where the frontend proxy needs to be rewritten for a testing environment. For example, in Vite, you can pass `import.meta.env.DEV`, or in webpack, you can pass `process.env.NODE_ENV === 'development'` after the proxy is set up.
withCredentials: boolean // 是否携带cookies; Include cookies.
localToken: boolean // 是否使用持久化存储token, 默认为localstorage存储, 也可以通过设置setLocalFunction和getLocalFunction来自定义持久化存储的设置和获取; Whether to use persistent storage for tokens. By default, tokens are stored in local storage. However, you can customize the storage and retrieval of tokens by setting `setLocalFunction` and `getLocalFunction`.
localTokenName: string // 持久化存储的token名; Name of the token used for persistent storage.
errorMeessages: Record<string, string> // json对象的形式来定义错误提示语, 当请求报错的时候直接提示, 例如{ 408: "请求超时!" }; Define error messages in the form of a JSON object, which will be used to display specific error messages when a request encounters an error. For example: { 408: "Request timeout!" }.
loadingFunction: function // 加载动画; Loading animation.
clearLoadingFunction: function // 清除动画; Clear the animation.
toastFunction: function // 错误提示的方法; Error message function.
responseInterceptors: Promise // 成功拦截器, 注意: 返回promise; Success interceptor, note: return a promise.
setLocalFunction: function // 自定义设置持久化存储的方法, 默认是localstorage; Customize the method for persistent storage. The default is local storage..
getLocalFunction: function // 自定义获取持久化存储的方法, 默认是localstorage; Customize the method for retrieving persistent storage. The default is local storage.

Request Options

method: "GET" | "POST" | "PUT" | "DELETE" | "OPTIONS" | "HEAD" | "PATCH"
showToast: boolean; // 是否展示加载动画和错误提示, 默认为true; Whether to display the loading animation and error notification. The default value is true
params: object // 请求拼接到url的query参数; Parameters appended to the URL for the request.
data: object // fetch的body传入的参数; Parameters passed in the body of the fetch request.
cache?: "default" | "no-store" | "reload" | "no-cache" | "force-cache" | "only-if-cached";

Api

import JFetch from "json_lee_fetch";
const request = new JFetch([Instance Options]);
request.request([url:string],[Request Options]);
request.get([url:string], [params: object], [Request Options]);
request.post([url:string], [data: object], [Request Options]);
request.upload([url:string], [data: object], [Request Options]);
request.put([url:string], [data: object], [Request Options]);
request.patch([url:string], [data: object], [Request Options]);
request.delete([url:string],[Request Options]);
request.head([url:string],[Request Options]);
request.options([url:string],[Request Options]);
request.setToken([value: string]);
request.getToekn();
request.clearLoading(); // 请求完成调用, 并非直接阻止加载动画, 而是在请求队列中减少一个值, 默认有处理, 一般不需要使用; Callback function to be called upon completion of the request. It does not directly stop the loading animation, but rather reduces a value in the request queue. By default, it is handled internally, and typically does not require explicit usage.
request.cancel(); // 终止所有正在进行的请求; Abort all ongoing requests.
request.download([url: string], [fileName: string], [Request Options])

Contact us

欢迎建议和反馈bug到邮箱 [email protected] 或 [email protected] Welcome to provide suggestions and report bugs via email at [email protected] or [email protected].