本地项目运行提示跨域问题

项目背景:我使用phpwebstudy在本地搭建了一个项目,然后前端是http://localhost:8080/

后端我直接创建了一个本地域名,例如www.abc.com

然后vue.config.js配置如下,这个配置在我所有线上环境是没有任何问题的

复制代码
devServer: {
        proxy: {
            '/adminapi': {
                target: 'http://www.abc.com/api',
                changeOrigin: true,
                pathRewrite: {
                    '^/adminapi': '/adminapi'
                }
            }
        }
    },

但是,在本地无法运行。

一直提示:

复制代码
/Proxy error: Could not proxy request /adminapi/Login/index from localhost:8080 to http://www.abc.com/api (ECONNREFUSED).

解决方案:

不用www.abc.com了,直接把后端的端口改成8081,然后vue.config.js配置如下

复制代码
devServer: {
        proxy: {
            '/adminapi': {
                target: 'http://127.0.0.1:8081/api',
                changeOrigin: true,
                pathRewrite: {
                    '^/adminapi': '/adminapi'
                }
            }
        }
    },

搞定!

哪怕你用http://localhost:8081/api都不行,感觉是两个localhost有冲突。

相关推荐
+VX:Fegn08951 小时前
计算机毕业设计|基于springboot + vue校园实验室管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
烤麻辣烫1 小时前
Web开发概述
前端·javascript·css·vue.js·html
计算机程序设计小李同学2 小时前
基于Web和Android的漫画阅读平台
java·前端·vue.js·spring boot·后端·uniapp
干前端2 小时前
Message组件和Vue3 进阶:手动挂载组件与 Diff 算法深度解析
javascript·vue.js·算法
zhengxianyi5152 小时前
Vue2 打包部署后通过修改配置文件修改全局变量——实时生效
前端·vue.js·前后端分离·数据大屏·ruoyi-vue-pro
灵犀坠2 小时前
Vue3 实现音乐播放器歌词功能:解析、匹配、滚动一站式教程
开发语言·前端·javascript·vue.js
Mo_jon2 小时前
vite + vue 快速构建 html 页面 (舒适编写html文件)
前端·vue.js·html
慧一居士12 小时前
Vite 中配置环境变量方法及完整示例
前端·vue.js
yyt36304584114 小时前
TypeScript { [key: string]: unknown } 索引签名写法和 Record 替代
前端·javascript·vue.js·typescript·ecmascript·es6
getapi16 小时前
在宝塔面板中部署 Vue 项目打包后的 dist 文件作为前端
前端·javascript·vue.js