你需要做一个反向代理的东西   ===> 打开你的vue项目的config文件夹下的index.js

找到以下代码

 dev: {
proxyTable: {
'/api': {
target: 'http://ip地址', //这里面是你要访问的IP地址
changeOrigin: true, //开启代理
pathRewrite: {
'^/api': '/api'
} }

修改后:

    dev: {
proxyTable: {
'/queue-admin': { // 使用"/queue-admin"来代替 API头部,可随意命名
//target: '...', // 源地址 本地开发的API头部
target: "...", // 配置到服务器后端的API头部
pathRewrite: {
'^/queue-admin': '/queue-admin' // 路径重写,第一个与上面相同,第二个/queue-admin 为server.context-path(服务器的上下文)
},
// 以下解决https 访问问题。上面的可以访问http
changeOrigin: true,
secure: false,
headers: {
Referer: '...'
}
}
}
}

Tips:配置完这里之后一定要重新启动项目要不然会没有效果

解决Vue跨域问题 : 正向代理与反向代理的更多相关文章

  1. 跨域问题,解决方案-Nginx反向代理

    跨域问题,解决之道 跨域问题,在日常开发过程中,是一个非常熟悉的名词.今天的话题,结合我之前的项目场景,讨论下<跨域问题,解决之道>. 跨域是什么 跨域问题,是由于JavaScript出于 ...

  2. 解决vue跨域axios异步通信

    在项目中,常常需要从后端获取数据内容.特别是在前后端分离的时候,前端进行了工程化部署,跨域请求成了一个前端必备的技能点.好在解决方案很多. 在vue中,在开发中,当前使用较多的是axios进行跨域请求 ...

  3. 解决vue跨域问题

    package com.qmtt.config; import java.io.IOException; import javax.servlet.Filter; import javax.servl ...

  4. [转]vue跨域解决方法

      vue跨域解决方法 vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' hea ...

  5. 用nginx的反向代理机制解决前端跨域问题

    什么是跨域以及产生原因 跨域是指a页面想获取b页面资源,如果a.b页面的协议.域名.端口.子域名不同,或是a页面为ip地址,b页面为域名地址,所进行的访问行动都是跨域的,而浏览器为了安全问题一般都限制 ...

  6. 用iframe设置代理解决ajax跨域请求问题

    面对ajax跨域请求的问题,想用代理的方式来解决这个跨域问题.在服务器端创建一个静态的代理页面,在客户端用iframe调用这个代理 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到aja ...

  7. Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试

    Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试 会撸码的小马 关注 2018.05.29 17:30* 字数 212 阅读 1488评论 0喜欢 2 接到上一章, ...

  8. 用nginx的反向代理机制解决前端跨域问题在nginx上部署web静态页面

    用nginx的反向代理机制解决前端跨域问题在nginx上部署web静态页面 1.什么是跨域以及产生原因 跨域是指a页面想获取b页面资源,如果a.b页面的协议.域名.端口.子域名不同,或是a页面为ip地 ...

  9. 项目部署问题:xftp无法连接服务器、Nginx403 Forbidden解决、nginx反向代理解决前端跨域问题

    一.xftp无法连接服务器 在xftp中配置正确的ip,用户名和密码后,居然无法连接 解决方案:将协议里面的FTP换成SFTP,注意换成SFTP后端口就默认换成22,要还是原来的21就还是连不上的哈 ...

随机推荐

  1. C# 动态加载程序集

    定义动态程序集 namespace DynamicAssembly { public class CodeDriver : MarshalByRefObject { private string pr ...

  2. SIGAI深度学习第九集 卷积神经网络3

    讲授卷积神经网络面临的挑战包括梯度消失.退化问题,和改进方法包括卷积层.池化层的改进.激活函数.损失函数.网络结构的改 进.残差网络.全卷机网络.多尺度融合.批量归一化等 大纲: 面临的挑战梯度消失问 ...

  3. P2168 [NOI2015]荷马史诗 k叉哈夫曼树

    思路:哈夫曼编码 提交:1次(参考题解) 题解:类似合并果子$QwQ$ 取出前$k$小(注意如果叶子结点不满的话要补全),合并起来再扔回堆里去. #include<cstdio> #inc ...

  4. animation-timing-function

    animation-timing-function 语法: animation-timing-function:<single-animation-timing-function>[,&l ...

  5. Vue项目开发最新、最全代码规范文档

    Vue项目开发最新.最全代码规范文档 2019年02月21日 10:43:49 yw00yw 阅读数 337   一. 目录结构 |— build 构建脚本目录 |— build.js 生产环境构建( ...

  6. 最小生成树&&次小生成树

    对于一个边上具有权值的图来说,其边权值和最小的生成树叫做图G的最小生成树 求无向图最小生成树主要有prim和kruskal两种算法 1.prim 将点集V分成Va和Vb两部分,Va为已经连入生成树的点 ...

  7. Mapreduce-实现webcount代码

    参考博文:https://blog.csdn.net/qq_41035588/article/details/90514824 首先安装一个Hadoop-Eclipse-Plugin 方便来对于hdf ...

  8. WGAN实验环境搭建

    "TensorFlow在Windows上支持Python 3.5.x和3.6.x." 因此,您无法在Windows上使用Python 2.7的tensorflow windows+ ...

  9. jenkins权限问题

    今天用jenkins的时候,构建失败,看了下控制台输出,提示是缺少权限,以前也遇到过这个问题,当时是通过把相关文件夹权限设置为777解决的,这种办法有两个不好的地方,一是这样一来任何用户都能操作这个文 ...

  10. Java排序之计数排序

    Java排序之计数排序 计数排序思路 计数排序适用于有明确范围的数组,比如给定一个数组,且知道所有值得范围是[m,n].这个时候可以使用一个n-m+1长度的数组,待排序的数组就可以散在这个数组上,数组 ...