2.10.82 • Published 2 years ago

wsvaio v2.10.82

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

常用工具函数

OSCS Status

createAPI

现代浏览器都支持了fetch方法

fetch(url).then(data => data.json()).(data => console.log(data));

fetch方法本身非常简洁,日常使用中肯定是要进行包装的

参考了koa express的中间件运行机制,将fetch请求设为核心中间件
在其之前都为【前置拦截器】,在其之后都为【后置拦截器】
并且在运行时使用了try catch finall,所以可以配置【错误拦截器】【最终拦截器】

Example

// 从头到尾其实就是ctx这一个对象,所有重要的的属性都在这个对象上,也可以自定义属性,createAPI提供泛型支持

const { DEV, VITE_BASE_API } = import.meta.env;
// 创建api对象 泛型添加自定义属性

export const { post, get, put, patch, del, request,
  error, final, before, after, extendAPI
} = createAPI<{ success?: string | boolean; headers: Record<string, string>; }>({
  baseURL: DEV ? "" : VITE_BASE_API,
  log: DEV, // 控制台是否打印日志
  timeout: 0,
  headers: {

  },
});

// 请求发出前
before(async ctx => Progress.start());
before(async ctx => {
  const auth = authStore();
  ctx.headers["Authorization"] = "Bearer " + auth.token;

});

// 请求发出后
// 复制响应消息
after(async ctx => ctx.message = ctx.data?.msg ?? ctx.message);
// 判断响应状态码
after(async ctx => (ctx.data?.code < 200 || ctx.data?.code > 299) && Promise.reject(ctx));
// 响应内容扁平化
after(async ctx => ctx.data = ctx.data?.data ?? ctx.data);


// 401登录失效
error(async ctx => {
  if (ctx?.data?.code != 401) return;
  // 不notice通知
  ctx.message = "";

  // 删除登录信息;重新登陆
  const auth = authStore();
  auth.logout();

});

// 结束时总会运行
// 进度条结束
final(async ctx => ctx.error ? Progress.done(false) : Progress.done());
// notice 通知 不设置success则不会通知
final(async ctx => ctx.error
  ? ctx.message && ElNotification.error(ctx.message)
  : ctx.success && ElNotification.success(ctx.success == true ? ctx.message : ctx.success));

Config

// 总环境类型 custom: 自定义属性 params: body query param 的类型
export type ctx<custom = {}, params = {}> = {
  log?: boolean, // 是否控制台打印日志
  timeout?: number, // 超时中断的时间
  url?: string, // 请求地址
  baseURL?: string, // 根地址
  body?: Partial<params> & { [k: string]: any; } | string, // 请求体
  query?: Partial<params> & { [k: string]: any; }, // 请求search参数
  param?: Partial<params> & { [k: string]: any; }, // 请求参数
  error?: Partial<Error & ctx<custom, params>>, // 错误
  data?: any, // 响应结果
  message?: string, // 响应消息
  status?: number, // 状态码
  response?: Response, // 响应
} & Omit<RequestInit, "body"> & custom; // RequestInit fetch配置 custom 自定义配置

Use

// src/api/index.ts
import { post } from "@/api/requets";
// 封装方法
export const testPost1 = post("xxx");
export const testPost2 = post({ url: "xxx", method: "GET", header: {} });



// 使用
testPost1().then(data => console.log(data));

// 柯里化函数,可以接受两层配置,后面的总会覆盖前面的
post<{abc: number}, string>({ url: "xxx/:abc" })({
  body: {}, // 请求体
  param: { abc: 1 }, // param参数 替换:abc
  query: {a: 1, b: 2} // query参数 拼接在路径后面(?a=1&b=2)
}).then(data => console.log(data));
import { extendAPI } from "@/api/requets";
// 使用extendAPI你可以方便的配置多个可能“雷同”的配置
export const { post, after } = extendAPI();

after(async ctx => {
  console.log("新的拦截器,不会影响requests");
});

post("xxx")().then(data => console.log(data));

merge

在默认配置下几乎等同于Object.assign
在typescript下obj2会有obj1的属性提示

/**
 * 合并两个对象到obj1
 * deep: 递归深度
 * overwrite: 是否赋值
 * del: 是否删除obj1中obj2不存在的key
 * rtn: 是否返回obj1
 */
export default function merge<T>(obj1: T, obj2 = <Partial<T> & { [k: string]: any }>{}, { deep = 1, overwrite = true, del = false, rtn = true } = {}) {
  deep--;
  if (del) {
    const dels = Object.keys(obj1).filter(item => !Object.keys(obj2).includes(item));
    for (const key of dels) delete obj1[key];
  }
  for (const [key, val] of Object.entries(obj2)) {
    if (!overwrite && (obj1[key] ?? false) !== false) continue;
    if (val instanceof Object && deep > 0) {
      (obj1[key] instanceof Object) || (obj1[key] = {});
      merge(obj1[key], val, { deep, overwrite, del, rtn });
    } else {
      obj1[key] = val;
    }
  }
  return rtn ? "" : obj1;
}

...

OSCS Status

2.10.77

2 years ago

2.10.78

2 years ago

2.10.79

2 years ago

2.10.80

2 years ago

2.10.81

2 years ago

2.10.82

2 years ago

2.10.70

2 years ago

2.10.71

2 years ago

2.10.72

2 years ago

2.10.73

2 years ago

2.10.74

2 years ago

2.10.75

2 years ago

2.10.76

2 years ago

2.10.60

2 years ago

2.10.61

2 years ago

2.10.62

2 years ago

2.10.63

2 years ago

2.10.64

2 years ago

2.10.65

2 years ago

2.10.66

2 years ago

2.10.68

2 years ago

2.10.69

2 years ago

2.10.30

2 years ago

2.10.31

2 years ago

2.10.32

2 years ago

2.10.33

2 years ago

2.10.34

2 years ago

2.10.35

2 years ago

2.10.36

2 years ago

2.10.37

2 years ago

2.10.38

2 years ago

2.10.39

2 years ago

2.9.9

2 years ago

2.10.40

2 years ago

2.10.41

2 years ago

2.10.42

2 years ago

2.10.43

2 years ago

2.10.44

2 years ago

2.10.45

2 years ago

2.10.46

2 years ago

2.10.47

2 years ago

2.10.48

2 years ago

2.10.49

2 years ago

2.10.1

2 years ago

2.10.2

2 years ago

2.10.10

2 years ago

2.10.11

2 years ago

2.10.0

2 years ago

2.10.12

2 years ago

2.10.13

2 years ago

2.10.14

2 years ago

2.10.15

2 years ago

2.10.16

2 years ago

2.10.17

2 years ago

2.10.18

2 years ago

2.10.19

2 years ago

2.10.9

2 years ago

2.10.7

2 years ago

2.10.8

2 years ago

2.10.5

2 years ago

2.10.6

2 years ago

2.10.3

2 years ago

2.10.4

2 years ago

2.10.20

2 years ago

2.10.21

2 years ago

2.10.22

2 years ago

2.10.23

2 years ago

2.10.24

2 years ago

2.10.25

2 years ago

2.10.26

2 years ago

2.10.27

2 years ago

2.10.28

2 years ago

2.10.29

2 years ago

2.10.50

2 years ago

2.10.51

2 years ago

2.10.52

2 years ago

2.10.53

2 years ago

2.10.54

2 years ago

2.10.55

2 years ago

2.10.56

2 years ago

2.10.57

2 years ago

2.10.58

2 years ago

2.10.59

2 years ago

2.2.1

2 years ago

2.2.0

2 years ago

2.0.2

2 years ago

2.4.1

2 years ago

2.2.3

2 years ago

2.4.0

2 years ago

2.2.2

2 years ago

2.6.1

2 years ago

2.2.5

2 years ago

2.6.0

2 years ago

2.4.2

2 years ago

2.2.4

2 years ago

2.8.1

2 years ago

2.6.3

2 years ago

2.4.5

2 years ago

2.2.7

2 years ago

2.8.0

2 years ago

2.6.2

2 years ago

2.4.4

2 years ago

2.2.6

2 years ago

2.2.10

2 years ago

2.0.1

2 years ago

2.0.0

2 years ago

2.9.2

2 years ago

2.7.4

2 years ago

2.9.1

2 years ago

2.7.3

2 years ago

2.7.6

2 years ago

2.9.3

2 years ago

2.7.5

2 years ago

2.9.6

2 years ago

2.7.8

2 years ago

2.9.5

2 years ago

2.9.8

2 years ago

2.9.7

2 years ago

2.7.9

2 years ago

2.3.0

2 years ago

2.1.2

2 years ago

2.1.1

2 years ago

2.5.0

2 years ago

2.3.2

2 years ago

2.1.4

2 years ago

2.3.1

2 years ago

2.1.3

2 years ago

2.7.0

2 years ago

2.5.2

2 years ago

2.3.4

2 years ago

2.5.1

2 years ago

2.3.3

2 years ago

2.9.0

2 years ago

2.7.2

2 years ago

2.7.1

2 years ago

2.3.5

2 years ago

2.8.10

2 years ago

2.1.0

2 years ago

2.8.3

2 years ago

2.2.9

2 years ago

2.8.2

2 years ago

2.6.4

2 years ago

2.2.8

2 years ago

2.8.5

2 years ago

2.8.4

2 years ago

2.8.7

2 years ago

2.8.6

2 years ago

2.8.9

2 years ago

2.8.8

2 years ago

1.1.0

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.2

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago