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

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

相关推荐
天道kabuto11 小时前
vue-i18n 升级 9.x 踩坑:正则表达式引发的“花括号”惨案
vue.js
天天喝旺仔12 小时前
Vue 3 组合式 API:从 Options 迁移到 script setup
前端·javascript·vue.js
Cry丶13 小时前
Vue 3 业务管理页面实战:组件拆分、父子通信与弹窗复用
前端·javascript·vue.js·父子通信·组件拆分·弹窗复用
雪芽蓝域zzs13 小时前
Vue前端配置路由通配捕获 404
前端·javascript·vue.js
木公子18 小时前
Vue3源码精读04:Scheduler 调度器深度解析|异步批量更新与任务队列源码全解
前端·vue.js
nicole bai19 小时前
dialog封装
前端·javascript·vue.js
索西引擎20 小时前
【Vue】Vue.js 3 声明式渲染架构的设计原理与模块协同机制研究
前端·javascript·vue.js
mayaairi1 天前
Vue2 事件绑定完全指南:从入门到原理
前端·javascript·vue.js
ℋᙚᵐⁱᒻᵉ鲸落1 天前
移动端滑动手势冲突:overflow: auto导致外层横向滑动失效
前端·javascript·css·vue.js·html
用户50093768390391 天前
热敏小票 Web 打印:我在 58/80mm 上折腾的两周
前端·vue.js