chore: update vFetch

Author: Simon he

README.md

@@ -31,19 +31,39 @@
 - isSymbol  // 判断是否是Symbol
 - isNaN  // 判断是否是NaN
 - isReg  // 判断是否是正则表达式
-- VFetch  // fetch请求封装 export interface IFetch {
-  url: string
+- vFetch  // 基于fetch的axios api式请求封装 export interface VFetch {
+  url?: string
+  baseURL?: string
+  body?: any
   method?: Method
   headers?: Record<string, string>
   credentials?: Credentials
   params?: Record<string, string>
   timeout?: number
-  returnType?: ReturnType
+  responseType?: ResponseType
   bodyType?: BodyType
   cache?: Cache
   redirect?: Redirect
   mode?: Mode
-  firstThen?: (response: Response) => Response
+  result?: Promise<any>
+  transformResponse?: (response: Response) => Response
+  set?: (target: keyof VFetch, value: Record<string, string>) => void
+  bodyToString?: () => string
+  request?: () => Promise<Response>
+  then?: (resolve: (value: any) => void, reject: (reason: any) => void) => Promise<void>
+  create?: (options: IFetchOptions) => (options: VFetch) => VFetch
+  interceptors?: {
+    request: {
+      use: (successCallback?: ((response: Response) => Response), errorCallback?: ((error: any) => Promise<never>)) => void
+      success: (response: Response) => Response
+      error: (error: any) => Promise<any>
+    },
+    response: {
+      use: (successCallback?: ((response: Response) => Response), errorCallback?: ((error: any) => Promise<never>)) => void
+      success: (response: Response) => Response
+      error: (error: any) => Promise<any>
+    }
+  }
 }
 - interceptError  // 自动捕获传入函数执行的异常
 
@@ -73,4 +93,6 @@
 ![traverse](assets/traverse.png)
 ### transformKey
 ![transformKey](assets/transformKey.png)
+### vFetch
+![vFetch](assets/vFetch.png)
 

assets/vFetch.png

@@ -37,6 +37,7 @@
     "dev": "pkgroll --watch",
     "play": "pnpm run -C playground dev",
     "play:build": "pnpm run -C playground build",
+    "serve": "pnpm run -C playground serve",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
     "typecheck": "vue-tsc --noEmit",
@@ -61,5 +62,8 @@
     "simon-js-tool": "workspace:^1.0.8",
     "typescript": "^4.7.2",
     "vitest": "^0.14.2"
+  },
+  "eslintConfig": {
+    "extends": "@antfu"
   }
 }

package.json

@@ -8,7 +8,8 @@
     "lint": "eslint .",
     "typecheck": "vue-tsc --noEmit",
     "preview": "vite preview",
-    "test": "vitest"
+    "test": "vitest",
+    "serve": "node ./server/index.js"
   },
   "dependencies": {
     "@vueuse/core": "^8.1.1",

playground/package.json

@@ -0,0 +1,27 @@
+const express = require('express')
+const app = express()
+app.all('*', (req, res, next) => {
+  // 设置允许跨域的域名，*代表允许任意域名跨域
+  res.header('Access-Control-Allow-Origin', '*')
+  // 允许的header类型
+  res.header('Access-Control-Allow-Headers', 'content-type')
+  // 跨域允许的请求方式
+  res.header('Access-Control-Allow-Methods', 'DELETE,PUT,POST,GET,OPTIONS')
+  if (req.method.toLowerCase() === 'options')
+    res.send(200) // 让options尝试请求快速结束
+  else
+    next()
+})
+
+app.get('/test', (req, res) => {
+  res.json({
+    code: 300,
+    body: {
+      name: 'simon',
+    },
+  })
+})
+
+app.listen(5001, () => {
+  // console.log('服务器启动5001')
+})

playground/server/index.js

@@ -1,6 +1,7 @@
 import { createApp } from 'vue'
 import { createRouter, createWebHistory } from 'vue-router'
 import routes from 'virtual:generated-pages'
+import { vFetch } from '../../src'
 import App from './App.vue'
 
 import '@unocss/reset/tailwind.css'
@@ -14,3 +15,26 @@ const router = createRouter({
 })
 app.use(router)
 app.mount('#app')
+
+vFetch.interceptors.request.use((response) => {
+  // console.log('request success', response)
+  return response
+})
+const instance = vFetch.create({
+  baseURL: 'http://localhost:5001/',
+})
+
+instance({
+  url: 'test',
+}).then((res: any) => {
+  // console.log(res)
+  return res
+})
+
+// vFetch.get({
+//   url: "http://localhost:5001/t"
+// }).then(res => {
+//   console.log(res)
+// }, err => {
+//   console.log(err)
+// })