vue3 解决跨域问题无效？
在配置 vue3 项目时，跨域问题时常困扰开发者。本文将针对常见的问题根源展开探讨，帮助您解决跨域难题。
问题一：'.env' 配置无效
您的 '.env' 配置中包含以下信息：
立即学习“前端免费学习笔记（深入）”；
vue_app_base_api=http://172.17.153.245:8732/interface
问题二：接口请求错误
您使用接口请求，但通过的地址却是 172.17.153.245:8732。
问题解析：
解决跨域问题的关键在于以下两点：
-
代理配置：确保您在 createproxy 方法中正确配置了代理规则，并将 "/interface" 修改为 "/"。
createproxy: (config) => { config.target = 'http://172.17.153.245:8732'; config.changeorigin = true; return config; } -
baseurl 设置：检查您的 axios 是否正确设置了 baseurl。您的 baseurl 应该与您的 '.env' 配置中的 vue_app_base_api 相匹配。
const app = createApp(App); app.config.globalProperties.$axios = axios.create({ baseURL: 'http://172.17.153.245:8732', }); - 环境变量一致性：确保您的 vue_port 环境变量与您的 baseurl 中的端口号一致。否则，可能会导致跨域请求失败。
通过上述步骤，您应该可以有效地解决 vue3 跨域问题，确保您的应用正常与后端通信。
