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

项目背景:我使用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有冲突。

相关推荐
哆啦A梦15881 小时前
axios 的二次封装
前端·vue.js·node.js
阿珊和她的猫1 小时前
深入理解与手写发布订阅模式
开发语言·前端·javascript·vue.js·ecmascript·状态模式
爱看书的小沐2 小时前
【小沐杂货铺】基于Three.js渲染三维风力发电机(WebGL、vue、react、WindTurbine)
javascript·vue.js·webgl·three.js·opengl·风力发电机·windturbine
罚时大师月色4 小时前
Vue+ts 如何实现父组件和子组件通信
javascript·vue.js·ecmascript
fury_1235 小时前
vue3:数组的.includes方法怎么使用
前端·javascript·vue.js
宁&沉沦5 小时前
Cursor 科技感的登录页面提示词
前端·javascript·vue.js
武天5 小时前
如果使用Vue3.0实现一个 Modal,你会怎么进行设计?
vue.js
敲敲敲敲暴你脑袋7 小时前
Canvas绘制自定义流动路径
vue.js·typescript·canvas
盛夏绽放7 小时前
uni-app Vue 项目的规范目录结构全解
前端·vue.js·uni-app
国家不保护废物8 小时前
Vue组件通信全攻略:从父子传到事件总线,玩转组件数据流!
前端·vue.js