
Vue3+Vite解决跨域问题
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue

·
Vue3项目
首先找到项目里面的vite.cofig.js找到代码中的server然后替换成下面的即可
server: { //主要是加上这段代码
//host+port实际上就是项目的启动地址是多少
host: '127.0.0.1',
port: 8001,
proxy: {
'/api': {
//这里的target实际上就是真实的后端地址,看看你的路径前缀如果有api的话在端口后面加上api
target: 'http://127.0.0.1:7090/api', //实际请求地址
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
},
}
}
附上vite.config.js的所有代码
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
import { fileURLToPath, URL } from 'node:url'
import { defineConfig, loadEnv } from 'vite'
import { wrapperEnv } from './build/utils';
import { createProxy } from './build/vite/proxy';
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig(({ mode, command}) => {
const root = process.cwd();
const env = loadEnv(mode, root);
const viteEnv = wrapperEnv(env);
const { VITE_PORT, VITE_PROXY } = viteEnv;
return {
plugins: [vue()],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
},
server: { //主要是加上这段代码
host: '127.0.0.1',
port: 8001,
proxy: {
'/api': {
target: 'http://127.0.0.1:7090/api', //实际请求地址
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
},
}
}
}
})
此时去使用APIfox访问地址就可以访问到了
推荐内容
阅读全文
AI总结




vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:7 个月前 )
9e887079
[skip ci] 5 个月前
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 9 个月前
更多推荐
相关推荐
查看更多
vue

vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
vue

Vue implementation of Geist
vue-devui

基于全新 DevUI Design 设计体系的 Vue3 组件库,面向研发工具的开源前端解决方案。
热门开源项目
活动日历
查看更多
直播时间 2025-03-13 18:32:35

全栈自研企业级AI平台:Java核心技术×私有化部署实战
直播时间 2025-03-11 18:35:18

从0到1:Go IoT 开发平台的架构演进与生态蓝图
直播时间 2025-03-05 14:35:37

国产工作流引擎 终结「996」开发困局!
直播时间 2025-02-25 14:38:13

免费开源宝藏 ShopXO,电商系统搭建秘籍大公开!
直播时间 2025-02-18 14:31:04

从数据孤岛到数据智能 - 企业级数据管理利器深度解析
目录
所有评论(0)