vue3前端代理,反向代理解决跨域问题(2024-7-18)

跨域原理

浏览器同源策略: 协议、域名和端口都相同是同源,浏览器会限制非同源请求读取响应结果。

本地开发环境通过 Vite 配置反向代理解决浏览器跨域问题.

生产环境则是通过 nginx 配置反向代理 。

vite.config.ts 配置代理

javascript 复制代码
server: {
    proxy: {
      '/v1': {
        target: 'https://api-ivm.com', //华为云远程服务,
        rewrite: path => path.replace(/^\/v1/, ''),
        changeOrigin: true,
        secure: false,
      }

    },
  },

表面肉眼看到的请求地址: http://localhost:3000/v1/users/me

真实访问的代理目标地址: https://api-ivm.com/v1/users/me

相关推荐
艾小码6 分钟前
告别加班!这些数组操作技巧让前端开发效率翻倍
前端·javascript
Rhys..1 小时前
ES6是什么
前端·javascript·es6
Jammingpro2 小时前
【Vue专题】前端JS基础Part1(含模版字符串、解构赋值、变量常量与对象)
前端·javascript·vue.js
jiangzhihao05156 小时前
前端自动翻译插件webpack-auto-i18n-plugin的使用
前端·webpack·node.js
软件技术NINI8 小时前
html css网页制作成品——HTML+CSS盐津铺子网页设计(5页)附源码
前端·css·html
mapbar_front9 小时前
面试问题—我的问题问完了,你还有什么想问我的吗?
前端·面试
quweiie10 小时前
thinkphp8+layui多图上传,带删除\排序功能
前端·javascript·layui
李鸿耀10 小时前
React 项目 SVG 图标太难管?用这套自动化方案一键搞定!
前端
闲蛋小超人笑嘻嘻10 小时前
树形结构渲染 + 选择(Vue3 + ElementPlus)
前端·javascript·vue.js
叶梅树10 小时前
从零构建A股量化交易工具:基于Qlib的全栈系统指南
前端·后端·算法