refactor: modify proxy setting

.env.dev

@@ -1 +1,2 @@
+# 是否开启服务接口代理 Y | N
 VITE_HTTP_PROXY=N

build/proxy.ts

@@ -1,33 +1,32 @@
 import type { ProxyOptions } from 'vite'
+import { mapEntries } from 'radash'
 
-/** 不同请求服务的环境配置 */
-export const proxyConfig: Record<ServiceEnvType, ServiceEnvConfig> = {
-  dev: {
-    url: 'https://mock.apifox.com/m1/4071143-0-default',
-    urlPattern: '/url-pattern',
-  },
-  test: {
-    url: 'http://localhost:8080',
-    urlPattern: '/url-pattern',
-  },
-  prod: {
-    url: 'https://mock.apifox.com/m1/4071143-0-default',
-    urlPattern: '/url-pattern',
+export function generateProxyPattern(envConfig: Record<string, string>) {
+  return mapEntries(envConfig, (key, value) => {
+    return [
+      key,
+      {
+        value,
+        proxy: `/proxy-${key}`,
       },
+    ]
+  })
 }
 
 /**
  * @description: 生成vite代理字段
  * @param {*} envConfig - 环境变量配置
  */
-export function createViteProxy(envConfig: ServiceEnvConfig) {
-  const proxy: Record<string, string | ProxyOptions> = {
-    [envConfig.urlPattern]: {
-      target: envConfig.url,
+export function createViteProxy(envConfig: Record<string, string>) {
+  const proxyMap = generateProxyPattern(envConfig)
+  return mapEntries(proxyMap, (key, value) => {
+    return [
+      value.proxy,
+      {
+        target: value.value,
         changeOrigin: true,
-      rewrite: path => path.replace(new RegExp(`^${envConfig.urlPattern}`), ''),
+        rewrite: (path: string) => path.replace(new RegExp(`^${value.proxy}`), ''),
       },
-  }
-
-  return proxy
+    ]
+  }) as Record<string, string | ProxyOptions>
 }

service.config.ts

@@ -0,0 +1,12 @@
+/** 不同请求服务的环境配置 */
+export const serviceConfig: Record<ServiceEnvType, Record<string, string>> = {
+  dev: {
+    url: 'https://mock.apifox.com/m1/4071143-0-default',
+  },
+  test: {
+    url: 'https://mock.apifox.com/m1/4071143-0-default',
+  },
+  prod: {
+    url: 'https://mock.apifox.com/m1/4071143-0-default',
+  },
+}

src/components/common/ErrorTip.vue

@@ -7,7 +7,7 @@ const router = useRouter()
 </script>
 
 <template>
-  <div class="flex-col-center h-full">
+  <div class="flex-col-center">
     <img
       v-if="type === '403'"
       src="@/assets/svg/error-403.svg"

src/service/http/index.ts

@@ -1,12 +1,13 @@
 import { createAlovaInstance } from './alova'
-import { proxyConfig } from '@/../build/proxy'
+import { serviceConfig } from '@/../service.config'
+import { generateProxyPattern } from '@/../build/proxy'
 
-const { url, urlPattern } = proxyConfig[import.meta.env.MODE]
+const { url } = generateProxyPattern(serviceConfig[import.meta.env.MODE])
 
 const isHttpProxy = import.meta.env.VITE_HTTP_PROXY === 'Y' || false
 
 export const alovaInstance = createAlovaInstance({
-  baseURL: isHttpProxy ? urlPattern : url,
+  baseURL: isHttpProxy ? url.proxy : url.value,
 })
 
 export const blankInstance = createAlovaInstance({

src/typings/env.d.ts

@@ -6,13 +6,6 @@
  */
 type ServiceEnvType = 'dev' | 'test' | 'prod'
 
-/** 后台服务的环境配置 */
-interface ServiceEnvConfig {
-  /** 请求地址 */
-  url: string
-  /** 匹配路径的正则字符串, 用于拦截地址转发代理(任意以 /开头 + 字符串, 单个/不起作用) */
-  urlPattern: '/url-pattern'
-}
 interface ImportMetaEnv {
   /** 项目基本地址 */
   readonly VITE_BASE_URL: string

vite.config.ts

@@ -1,13 +1,14 @@
 import { resolve } from 'node:path'
 import { defineConfig, loadEnv } from 'vite'
 import { createVitePlugins } from './build/plugins'
-import { createViteProxy, proxyConfig } from './build/proxy'
+import { createViteProxy } from './build/proxy'
+import { serviceConfig } from './service.config'
 
 // https://vitejs.dev/config/
 export default defineConfig(({ mode }) => {
   // 根据当前工作目录中的 `mode` 加载 .env 文件
   const env = loadEnv(mode, __dirname, '') as ImportMetaEnv
-  const envConfig = proxyConfig[mode as ServiceEnvType]
+  const envConfig = serviceConfig[mode as ServiceEnvType]
 
   return {
     base: env.VITE_BASE_URL,