---

一、概述

跨域是指由于瀏覽器的同源策略限制，向不同源(不同協議、不同域名、不同端口)發送ajax請求會失敗

二、報錯現象

三、通過配置代理來解決

修改request.js中的baseURL為/api

在vite.config.js中增加代理配置

完整內容：

import { fileURLToPath, URL } from 'node:url'import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools'// https://vite.dev/config/
export default defineConfig({plugins: [vue(),vueDevTools(),],resolve: {alias: {'@': fileURLToPath(new URL('./src', import.meta.url))},},server: {proxy: {'/api': { // 匹配所有以 /api 開頭的請求target: 'http://localhost:8080',  // 代理目標地址changeOrigin: true,rewrite: (path) => path.replace(/^\/api/, ''),  // 重寫路徑，將 /api 替換為空},},}
})

四、參考資料

https://www.bilibili.com/video/BV14z4y1N7pg?spm_id_from=333.788.player.switch&vd_source=0467ab39cc5ec5940fee22a0e7797575&p=73