通过Vue-cli解决前端跨域问题

news2024/11/25 7:16:43

1、找到vue.config.js

在vue.config.js当中增加如下配置

devServer: {
    port: 3001,
    proxy: {
	 '/agent': {
		target: 'http://10.8.50.250:6666',
		ws: false,            //true,开启ws, 如果是http代理此处可以不用设置
		changeOrigin: true,   // 如果接口跨域,需要进行这个参数配置为true
		//这里注意路径以/开头,范围越大的越靠后
		pathRewrite: {
		  '^/agent/code': '/agent/code',
		  '^/agent/admin/login/system': '/agent/admin/login/system',
		  '^/agent': '/ym/agent',
		}
	  },
	}
 }

'/agent'表示前端以"/agent"开头的请求都会经过处理,通过http://10.8.50.250:6666代理服务器进行转发,这里就保证前端访问后台的服务器跟后台服务器协议,主机和端口都一致,从而解决跨域问题

这里需要注意pathRewrite的配置,这里可以配置多个路径,从而解决,一个前端对应多个后台服务器,多个服务器路径要求不一样的情况,pathRewrite的配置要注意/开头,否则配置无效

 在vue.config.js增加完以上配置之后,还需要在前端的request.js(统一配置请求和返回的地方)进行路径配置,所有的接口路径前面加上“/agent”,这样才能保证前端的所有请求都是以"/agent"开头,然后vue.config.js里面的代理配置才能生效,另外还要注意一点,前端工程必须要是通过vue-cli工具创建的才能生效。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/795804.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

面向对象编程:深入理解抽象类和关键字

文章目录 1. 关键字1.1 static1.2 final1.3 static final 2. 抽象类2.1 抽象类的推导过程2.2 抽象类能否创建对象?2.3 抽象类的意义2.4 判断 3. 案例:计算圆形和长方形的周长及面积 在Java编程中,我们经常会遇到一些特殊的关键字和概念&#…

Kyuubi入门简介

一、官方简介 HOME — Apache Kyuubi 二、概述 1、一个企业级数据湖探索平台 2、一个高性能的通用JDBC和SQL执行引擎 3、一个基于spark的查询引擎服务 三、优点 1、提供hiveserver2查询spark sql的能力,查询效率更为高效,首次构建连接时会持续保持连…

学习笔记21 list

一、概述 有两种不同的方法来实现List接口。ArrayList类使用基于连续内存分配的实现,而LinkedList实现基于linked allocation。 list接口提供了一些方法: 二、The ArrayList and LinkedList Classes 1.构造方法 这两个类有相似的构造方法&#xff1a…

数据结构--串、数组、广义表

这里写目录标题 串定义案例引用串的类型定义以及存储结构抽象类型定义存储结构(顺序表较为常用)顺序存储结构链式存储结构 串的模式匹配算法(查找主串中是否有某个字串)BF算法KMP算法设计思想对字串的回溯进行了优化代码对next【j】进行优化 数组类型一维…

C#,数值计算——Kolmogorov-Smirnov累积分布函数的计算方法与源程序

using System; namespace Legalsoft.Truffer { /// <summary> /// Kolmogorov-Smirnov累积分布函数 /// Kolmogorov-Smirnov cumulative distribution functions /// and their inverses. /// </summary> public class KSdist { …

【网络编程】(TCP流套接字编程 ServerSocket API Socket API 手写TCP版本的回显服务器 TCP中的长短连接)

文章目录 网络编程TCP流套接字编程ServerSocket APISocket APITCP中的长短连接手写TCP版本的回显服务器 网络编程 TCP流套接字编程 TCP提供的API主要是两个类:ServerSocket 和 Socket . TCP不需要一个类来表示"TCP数据报"因为TCP不是以数据报为单位进行传输的.是以…

电机故障诊断(python程序,模型为CNN结合LSTM)

代码运行环境要求&#xff1a;TensorFlow版本>2.4.0&#xff0c;python版本>3.6.0 运行效果视频&#xff1a;电机故障诊断&#xff08;python代码&#xff09;_哔哩哔哩_bilibili 1.电机常见的故障类型有以下几种&#xff1a; 轴承故障&#xff1a;轴承是电机运转时最容…

用于永磁同步电机驱动器的自适应SDRE非线性无传感器速度控制(MatlabSimulink实现)

目录 &#x1f4a5;1 概述 &#x1f4da;2 运行结果 &#x1f389;3 参考文献 &#x1f308;4 Matlab代码&Simulink仿真实现 &#x1f4a5;1 概述 本文方法基于状态依赖的里卡蒂方程&#xff08;SDRE&#xff09;控制技术及其梯度型神经网络的实时计算方法&#xff0c;允许…

Gorm中Belong to 自引用

//评论 type Comment struct {gorm.ModelContent string //内容ParentID uint //评论的父级评论idParentComment *Comment gorm:"foreignkey:ParentID;references:ID" //重写外键与重写引用 gorm的belongTo关系 }func One2one() {GLOAB_DB.AutoMigrate(&Commen…

Latex error——Unknown graphics extension: .eps解决办法

1. 问题描述 使用PDFTeXify进行编译出现错误 2. 错误原因 使用includegraphics插入图片为eps格式&#xff0c;此种方法只能用latex默认编译器使用&#xff0c;如果使用pdflaTex则不能插入.eps格式图片。 3. 解决办法 在开头添加 \usepackage{epstopdf}

专项练习-04编程语言-03JAVA-01

1. 以下有关构造方法的说法&#xff0c;正确的是&#xff1a;&#xff08;&#xff09; A 一个类的构造方法可以有多个 B 构造方法在类定义时被调用 C 构造方法只能由对象中的其他方法调用 D 构造方法可以和类同名&#xff0c;也可以和类名不同 正确答案&#xff1a;A 官方解析…

使用Anaconda3创建pytorch虚拟环境

一、Conda配置Pytorch环境 1.conda安装Pytorch环境 打开Anaconda Prompt&#xff0c;输入命令行&#xff1a; conda create -n pytorch python3.6 ​ 输入y&#xff0c;再回车。 稍等&#xff0c;便完成了Pytorch的环境安装。我们可以利用以下命令激活pytorch环境。 conda…

比XShell更好用,更现代的终端工具-Tabby

目录 简介&#xff1a;Tabby 是一名老外在 Github 开源的终端连接的工具&#xff0c; 安装教程&#xff1a; SSH连接功能&#xff1a; SFTP文件传输功能&#xff1a; 设置&#xff1a; 简介&#xff1a;Tabby 是一名老外在 Github 开源的终端连接的工具&#xff0c; Tabby 的…

进制和进制转换

什么是进制 进制的全称是进位计数制&#xff0c;是人为定义的带进位的计数方法&#xff0c;对于任何一种X进制&#xff0c;就表示每一位置上的数运算时都是逢 X进一位。 十进制是逢十进一&#xff0c;十六进制是逢十六进一&#xff0c;二进制就是逢二进一&#xff0c;以此类推…

数据出境要依法“过安检”!什么是数据出境?

为了规范数据出境活动&#xff0c;保护个人信息权益&#xff0c;维护国家安全和社会公共利益&#xff0c;促进数据跨境安全、自由流动。从2022年9月1日起&#xff0c;《数据出境安全评估办法》施行。什么是数据出境&#xff0c;什么情况下需要进行数据出境安全评估呢&#xff1…

windows下安装composer

安装Php 教程 下载composer 官网 中文网站 exe下载地址 下载好exe 双击运行 找到php.ini注释一行代码 测试 composer -v说明安装成功 修改源 执行以下命令即可修改 composer config -g repo.packagist composer https://packagist.phpcomposer.com # 查看配置…

基于springboot+mybatis +mysql+jsp图书管理系统

基于springbootmybatis mysqljsp图书管理系统 一、系统介绍二、功能展示1.用户登陆2.用户注册3.图书借阅(学生)4.我的借阅&#xff08;学生&#xff09;5.图书管理&#xff08;管理员&#xff09;6.用户管理&#xff08;管理员&#xff09;7.借阅信息&#xff08;管理员&#x…

VScode中python的相对路径与绝对路径 FileNotFoundError: [Errno 2] No such file or directory

VScode中&#xff0c;python里的相对路径是相对于当前工作目录来定位的&#xff0c;而当前的工作目录在VScode中下方的终端窗口会有提示&#xff1a; 说明此时的工作目录并非当前python文件所在的目录&#xff0c;而是C:\Users\xxxxx(你的用户名)。因此&#xff0c;使用VScode…

【Apollo学习笔记】—— Cyber RT之创建组件

文章目录 前言0. 前置知识0.1 什么是 Component0.2 Component 的类型0.3 Component 的创建及工作流程0.4 Component 如何被加载0.5 Component 的优点 1. 初始化组件的目录结构2. 实现组件类2.1 头文件2.2 源文件2.3 创建 BUILD 文件 3. 设置配置文件3.1 配置 DAG 文件3.2 配置 …

每克卖1.67亿美元——内嵌富勒烯

英国牛津大学的科学家宣称&#xff0c;一个叫做Designer Carbon Materials的实验室正在生产内嵌富勒烯&#xff0c;而且还以3.2万美元的天价出售了200微克。 内嵌富勒烯于1985年被首次发现&#xff0c;它是由碳原子组成的球形结构。因其形状而被昵称为“巴基球”。60个碳原子组…