vue-cli反向代理

简介: vue-cli反向代理

如今的前后端分离的项目,前端地址和后端地址由于浏览器的同源策略存在跨域问题,所以我们很多时候需要通过不同的方法(比如JSONP,CORS,设置代理)解决跨域问题,这里在vue项目中使用了vue-cli反向代理的方式解决


  • 在我们开发环境中前端地址访问本地的后端vue-cli地址不存在跨域问题,本地vue-cli后端访问后端服务器也不存在跨域,所以我们可以设置vue-cli反向代理给后端服务器,解决跨域的问题


  • 这里设置vue-cli项目中的vue.config.js的配置文件下的devServer节点下的proxy属性解决


module.exports = {
  devServer: {
    // 代理配置
    proxy: {
      // 当我们本地访问带有/api的时候才会触发跨域
      '/api': {
        target: 'wwww.xxx.com', // 要代理的地址
        changeOrigin: true, // 是否跨域,需要设置为true
        // 路径重写
        pathRewrite: {
          // 路径重写默认 localhost: xxx/api/abc => www.xxx.com/api/abc
          '^/api': '' // 设置为 localhost: xxx/api/abc => www.xxx.com/abc
        }
      }
    }
  }
}
相关文章
|
7月前
|
人工智能 监控 JavaScript
Claude Code 必装插件:claude-hud 让你的 AI 编程效率翻倍
![封面图](https://oscimg.oschina.net/oscnet/up45b3d45a4d73cfc21ab909d1632066be5b9.png) JeecgBoot AI专题研究 Claude Code 状态监控插件 claudehud 深度体验与实战指南 你真的了解 Cla
4749 1
Claude Code 必装插件:claude-hud 让你的 AI 编程效率翻倍
|
存储 JavaScript 安全
Web渗透-XSS漏洞深入及xss-labs靶场实战
XSS(跨站脚本攻击)是常见的Web安全漏洞,通过在网页中注入恶意脚本,窃取用户信息或执行非法操作。本文介绍其原理、分类(反射型、存储型、DOM型)、测试方法及xss-labs靶场实战案例,帮助理解与防御XSS攻击。
3678 1
Web渗透-XSS漏洞深入及xss-labs靶场实战
|
Oracle Java Linux
JDK
JDK
6069 0
|
消息中间件 Java 数据处理
深入理解RabbitMQ中的prefetch_count参数
在某一次用户标签服务中大量用到异步流程,使用了RabbitMQ进行解耦。其中,为了提高消费者的处理效率针对了不同节点任务的消费者线程数和prefetch_count参数都做了调整和测试,得到一个相对合理的组合。这里深入分析一下prefetch_count参数在RabbitMQ中的作用。
1311 5
深入理解RabbitMQ中的prefetch_count参数
|
人工智能 自然语言处理 API
谷歌Gemini使用教程,从认识gemini到精通使用
谷歌 Gemini 是由 Google 开发的一种多模态 AI 语言模型,具备多项强大功能,能够理解和生成自然语言,协助完成各种与语言相关的任务。
|
前端开发 API Python
WebSocket技术详解:如何在Python Web应用中实现无缝实时通信
在Web开发的广阔领域中,实时通信已成为许多应用的核心需求。传统的HTTP请求-响应模型在实时性方面存在明显不足,而WebSocket作为一种在单个长连接上进行全双工通信的协议,为Web应用的实时通信提供了强有力的支持。本文将深入探讨WebSocket技术,并通过一个Python Web应用的案例分析,展示如何在Python中利用WebSocket实现无缝实时通信。
753 3
|
人工智能 自然语言处理 IDE
Trae 开发工具与使用技巧
V哥推荐字节推出的AI原生IDE——Trae,这款工具大幅提升程序员开发效率。Trae定位为“AI协同编程”伙伴,支持零基础用户通过对话完成项目开发。其核心功能包括Builder模式自动生成代码、智能问答辅助开发、上下文引用与多模态开发等。对比Cursor和Windsurf,Trae在中文支持、全自动项目管理和免费模型使用上更具优势。新手可通过3步快速上手:启动Builder模式、一键运行调试、迭代优化。立即体验Trae,开启AI时代编程新篇章!
5639 2
|
存储 机器学习/深度学习 人工智能
RAG:AI大模型联合向量数据库和 Llama-index,助力检索增强生成技术
RAG:AI大模型联合向量数据库和 Llama-index,助力检索增强生成技术
RAG:AI大模型联合向量数据库和 Llama-index,助力检索增强生成技术