若依中反向代理解决跨域问题

在Vue开发环境中,为了解决前后端不同端口导致的跨域问题,文章介绍了如何使用Vue.config.js设置反向代理。通过将前端的/dev-api路径重写为空,代理请求到后端的http://localhost:8080/captchaImage,从而实现图片资源的正常获取。
摘要由CSDN通过智能技术生成

从Vue中获取图片,是在后端获取,但获取图片url路径是前端的

http://localhost/dev-api/captchaImage

localhost:8080 是后端页面,路径中localhost 默认是localhost:80 端口属于前端页面,由于前后端端口不一样,为了防止跨域问题,使用反向代理,url请求前端进行代理,再映射到后端,解决跨域问题

在vue.config.js进行代理

在前端所有页面中,开发环境默认url为/dev-api

# 若依管理系统/开发环境

VUE_APP_BASE_API = '/dev-api'

而在pathRewrite中路径重写将/dev-api换为 '' ,保留 captchaImage 再映射到http://localhost:8080

http://localhost/dev-api/captchaImage > http://localhost/captchaImage >

http://localhost:8080/captchaImage

后端就能接收到代理了

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

我再也不吃夜宵啦

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值