@base-web-kits/base-tools-web 1.0.2 → 1.1.0-alpha.0

package/dist/network/request.d.ts

@@ -0,0 +1,151 @@
+/** 请求方法类型 */
+export type RequestMethod = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'CONNECT' | 'HEAD' | 'OPTIONS' | 'TRACE' | 'PATCH';
+/**
+ * 请求参数类型
+ * 包含 fetch 原生支持的 BodyInit 类型，以及支持自动 JSON 序列化的对象和数组
+ */
+export type RequestData = string | ArrayBuffer | ArrayBufferView | Blob | FormData | URLSearchParams | ReadableStream<Uint8Array> | Record<string, unknown> | unknown[] | null;
+/**
+ * 响应数据类型
+ */
+export type ResponseData = string | ArrayBuffer | Blob | Record<string, unknown> | unknown[] | null;
+/**
+ * 发起请求的配置 (对外,参数可选)
+ */
+export type RequestConfig<D extends RequestData = RequestData> = Partial<RequestConfigBase<D>>;
+/**
+ * 自定义请求的配置 (接口字段参数必填)
+ */
+export type RequestConfigBase<D extends RequestData = RequestData> = {
+    /** 接口地址 */
+    url: string;
+    /** 请求方法 */
+    method?: RequestMethod;
+    /** 请求头 */
+    header?: Record<string, string>;
+    /** 请求参数 */
+    data?: D;
+    /** 超时时间 (毫秒), 默认 60000 */
+    timeout?: number;
+    /** 接口返回响应数据的字段, 支持"a[0].b.c"的格式, 当配置false时返回完整的响应数据 */
+    resKey: string | false;
+    /** 接口返回响应消息的字段, 支持"a[0].b.c"的格式 */
+    msgKey: string;
+    /** 接口返回响应状态码的字段, 支持"a[0].b.c"的格式 */
+    codeKey: string;
+    /** 接口返回成功状态码的字段, 支持"a[0].b.c"的格式 (默认取 codeKey) */
+    successKey?: string;
+    /** 成功状态码 */
+    successCode: (number | string)[];
+    /** 登录过期状态码 */
+    reloginCode: (number | string)[];
+    /** 是否显示进度条 (默认true) */
+    showLoading?: boolean;
+    /** 是否提示接口异常 (默认true) */
+    toastError?: boolean;
+    /** 是否输出日志 (默认true) */
+    isLog?: boolean;
+    /** 额外输出的日志数据 */
+    extraLog?: Record<string, unknown>;
+    /** 响应数据的缓存时间, 单位毫秒。仅在成功时缓存；仅缓存在内存，应用退出,缓存消失。(默认0,不开启缓存) */
+    cacheTime?: number;
+    /** 是否开启流式传输 (如 SSE) */
+    enableChunked?: boolean;
+    /** 响应类型 (默认 json, enableChunked为true时忽略) */
+    responseType?: 'text' | 'arraybuffer' | 'json';
+    /** 响应拦截 */
+    responseInterceptor?: (data: ResponseData) => ResponseData;
+};
+/**
+ * 请求任务对象 (用于取消请求或监听流式数据)
+ */
+export interface RequestTask {
+    /** 取消请求 */
+    abort: () => void;
+    /** 监听流式数据块接收事件 */
+    onChunkReceived: (callback: ChunkCallback) => void;
+    /** 取消监听流式数据块接收事件 */
+    offChunkReceived: () => void;
+}
+/**
+ * 流式数据块接收事件回调
+ */
+export type ChunkCallback = (response: {
+    data: ArrayBuffer;
+}) => void;
+/**
+ * 基础请求 (返回 Promise 和 Task 对象)
+ * 基于 fetch API 封装，支持流式请求
+ * @param config 请求配置
+ * @returns Promise<T> & { task?: RequestTask }
+ * @example
+ * // 在入口文件完成配置 (确保请求失败有toast提示,登录过期能够触发重新登录,log有日志输出)
+ * setBaseToolsConfig({
+ * toast: ({ msg, status }) => (status === 'fail' ? message.error(msg) : message.success(msg)),
+ * showLoading: () => message.loading('加载中...'),
+ * hideLoading: () => message.destroy(),
+ * toLogin: () => reLogin(),
+ * log(level, data) {
+ *   if (data.name === 'request') {
+ *     sendLog('request', data); // 请求日志
+ *   } else if (level === 'error') {
+ *     sendLog('error', data); // 错误日志
+ *   } else {
+ *     sendLog('action', data); // 操作日志
+ *   }
+ * },
+ * });
+ *
+ * // 封装项目的基础请求
+ * export function requestApi<T>(config: RequestConfig) {
+ *    return request<T>({
+ *      header: { token: 'xx', version: 'xx', tid: 'xx' }, // 会自动过滤空值
+ *      // responseInterceptor: (res) => res, // 响应拦截，可预处理响应数据，如解密 (可选)
+ *      resKey: 'data',
+ *      msgKey: 'message',
+ *      codeKey: 'status',
+ *      successCode: [1],
+ *      reloginCode: [-10],
+ *      ...config,
+ *    });
+ * }
+ *
+ * // 1. 基于上面 requestApi 的普通接口
+ * export function apiGoodList(data: { page: number, size: number }) {
+ *   return requestApi<GoodItem[]>({ url: '/goods/list', data, resKey: 'data.list' });
+ * }
+ *
+ * const goodList = await apiGoodList({ page:1, size:10 });
+ *
+ * // 2. 参数泛型的写法
+ * export function apiGoodList(config: RequestConfig<{ page: number, size: number }>) {
+ *   return requestApi<GoodItem[]>({ url: '/goods/list', resKey: 'data.list', ...config });
+ * }
+ *
+ * const goodList = await apiGoodList({ data: { page:1, size:10 }, showLoading: false });
+ *
+ * // 3. 基于上面 requestApi 的流式接口
+ * export function apiChatStream(data: { question: string }) {
+ *   return requestApi<T>({
+ *     url: '/sse/chatStream',
+ *     data,
+ *     resKey: false,
+ *     showLoading: false,
+ *     responseType: 'arraybuffer',
+ *     enableChunked: true,
+ *   });
+ * }
+ *
+ * const { task } = apiChatStream({question: '你好'}); // 发起流式请求
+ *
+ * task.onChunkReceived((res) => {
+ *   console.log('ArrayBuffer', res.data); // 接收流式数据
+ * });
+ *
+ * task.offChunkReceived(); // 取消监听,中断流式接收 (调用时机:流式结束,组件销毁,页面关闭)
+ * task.abort(); // 取消请求 (若流式传输中,会中断流并抛出异常)
+ */
+export declare function request<T, D extends RequestData = RequestData>(config: RequestConfigBase<D>): Promise<T> & {
+    task?: RequestTask;
+};
+//# sourceMappingURL=request.d.ts.map

package/dist/network/request.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"request.d.ts","sourceRoot":"","sources":["../../src/web/network/request.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@base-web-kits/base-tools-web",
-  "version": "1.0.2",
+  "version": "1.1.0-alpha.0",
   "sideEffects": false,
   "description": "Independent Web utilities package built from src/web.",
   "keywords": [

package/src/web/config/index.ts

@@ -0,0 +1,67 @@
+export type AppConfig = {
+  /** 全局 Toast 提示 */
+  toast?: (option: { msg: string; status: 'success' | 'fail' }) => void;
+  /** 显示全局 Loading */
+  showLoading?: () => void;
+  /** 隐藏全局 Loading */
+  hideLoading?: () => void;
+  /** 跳转登录页的方法 */
+  toLogin?: () => void;
+  /** 日志记录函数 */
+  log?: (level: 'info' | 'error' | 'warn' | 'debug', data: AppLogInfo) => void;
+};
+
+export type AppLogInfo = {
+  /** 调用函数的名称 */
+  name: string;
+
+  /** 函数的调用状态 */
+  status?: 'success' | 'fail';
+
+  /** 函数的调用参数 */
+  option?: unknown;
+
+  /** 函数的调用结果 */
+  res?: unknown;
+
+  /** 函数的调用错误 */
+  e?: unknown;
+
+  /** 日志描述 */
+  desc?: string;
+
+  // 其他自定义属性
+  [key: string]: unknown;
+};
+
+const appConfig: AppConfig = {};
+
+/**
+ * 获取应用配置
+ */
+export function getBaseToolsConfig() {
+  return appConfig;
+}
+
+/**
+ * 初始化应用配置 (在入口文件设置)
+ * @example
+ * setBaseToolsConfig({
+ * toast: ({ msg, status }) => (status === 'fail' ? message.error(msg) : message.success(msg)),
+ * showLoading: () => message.loading('加载中...'),
+ * hideLoading: () => message.destroy(),
+ * toLogin: () => reLogin(),
+ * log(level, data) {
+ *   if (data.name === 'request') {
+ *     sendLog('request', data); // 请求日志
+ *   } else if (level === 'error') {
+ *     sendLog('error', data); // 错误日志
+ *   } else {
+ *     sendLog('action', data); // 操作日志
+ *   }
+ * },
+ * });
+ */
+export function setBaseToolsConfig(newConfig: AppConfig) {
+  Object.assign(appConfig, newConfig);
+}

package/src/web/index.ts

@@ -2,9 +2,10 @@
  * 内部统一导出, 外部快捷引入: import {xx} from 'base-tools/web'
  */
 export * from './clipboard';
+export * from './config';
 export * from './cookie';
 export * from './device';
 export * from './dom';
-export * from './load';
+export * from './network';
 export * from './storage';
 export * from './url';

package/src/web/network/index.ts

@@ -0,0 +1,2 @@
+export * from './load';
+export * from './request';