在config/index.js找到 proxyTable对象,添加键值对即可。

"/api":{

  target:"http://192.168.1.1",

  changeOrighn:true,

  pathRewrite:{

    "^/api":" "

  }

}

倘若加上了这对键值对,意思就是以后的请求路径中存在 /api ,就是将 /api 隐式替换成 target+pathRewrite["/api"]

可能说了这样说,大家还是有点不明白,那就举一个例子:

  在使用vue时,请求地址,均为 localhost开头,若需要请求到 192.168.1.115/dataForYou 接口的数据,那么就存在跨域限制,那么就可以在配置文件中加上

"/api":{

  target:"http://192.168.1.115",

  changeOrighn:true,

  pathRewrite:{

    "^/api":" "

  }

},然后直接请求 /api/dataForYou,即可获得数据,并且其中 /api 可以保存为全局变量。

那么里面的pathRewrite到底有什么作用呢?我想应该是为了方便接口,

假如,有大量接口 {192.168.1.15/a/1-100}{100}, {198.168.1.15/b/1-100}{100};那么定义target为192.168.1.15,在pathRewrite中定义

vue使用代理实现开发阶段跨域的更多相关文章

  1. nodejs 代理 解决开发环境跨域问题

    前后端分离项目中,会遇到跨域问题.解决方法无非就是jsonp cors等. 本次项目前端不搭node服务,线上用nginx搭站点,nginx转发ajax请求server. 本地开发环境的跨域问题用no ...

  2. Vue开发环境跨域访问

    Vue开发环境跨域访问其他服务器或者本机其他端口,需要配置项目中config/index.js文件,修改如下 module.exports = { dev: { // Paths assetsSubD ...

  3. vue 解决axios请求出现前端跨域问题

    vue 解决axios请求出现前端跨域问题 最近在写纯前端的vue项目的时候,碰到了axios请求本机的资源的时候,出现了访问报404的问题.这就让我很难受.查询了资料原来是跨域的问题. 在正常开发中 ...

  4. Vue中应用CORS实现AJAX跨域,及它在 form data 和 request payload 的小坑处理

    基本概念部分(一):理解CORS 说道Vue的跨域AJAX,我想先梳理一遍CORS跨域,"跨域资源共享"(Cross-origin resource sharing),它是一个W3 ...

  5. Spring Boot Web应用开发 CORS 跨域请求支持:

    Spring Boot Web应用开发 CORS 跨域请求支持: 一.Web开发经常会遇到跨域问题,解决方案有:jsonp,iframe,CORS等等CORS与JSONP相比 1. JSONP只能实现 ...

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

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

  7. 使用nginx反向代理处理前后端跨域访问

    本文主要解决:使用nginx反向代理处理前后端跨域访问的问题 1.何为跨域访问? 以下类型为跨域访问 1)不同域名间访问 www.zuiyoujie.com和www.baidu.com 2)同域名不同 ...

  8. 【坑】前后端分离开发中 跨域问题以及前台不带cookie的问题

    文章目录 前言 跨域问题 cookie问题 拦截器导致的跨域问题 后记 前言 场景一: 前台哒哒哒的点击页面,发送请求,但是后台服务器总是没有回应,后台接口虽打了断点,但是根本进不到断点处: 前端:我 ...

  9. Vue Springboot (包括后端解决跨域)实现登录验证码功能详细完整版

    利用Hutool 基于Vue.ElementUI.Springboot (跨域)实现登录验证码功能 前言 一.Hutool是什么? 二.下面开始步入正题:使用步骤 1.先引入Hutool依赖 2.控制 ...

随机推荐

  1. MySQL处理表字段小技巧

    MySQL利用正则函数替换值 update dateTest set date=REPLACE(date,'/','') where date REGEXP '\/'; SQL语句讲解: -- 将 所 ...

  2. 怎么通过tomcat的catalina.out查看日志

    进入tomcat的logs目录下:cd apache-tomcat/logs/ 查看logs下的文件和目录:ll   可以找到catalina.out文件: 实时查看日志: tail -fn 100 ...

  3. Hadoop Hbase理论及实操

    Hbase特点 HBase是一个构建在HDFS上的分布式列存储系统:HBase是基于Google BigTable模型开发的,典型的key/value系统:HBase是Apache Hadoop生态系 ...

  4. poj 2506 Tiling(高精度)

    Description In how many ways can you tile a 2xn rectangle by 2x1 or 2x2 tiles? Here is a sample tili ...

  5. 基于MySQL自增ID字段增量扫描研究

    目录 目录 1 1. 问题 1 2. 背景 1 3. InnoDB表 2 3.1. 自增ID为主键 2 3.2. 自增ID为普通索引 4 3.3. 原因分析 7 4. MyISAM表 8 4.1. 自 ...

  6. Java中的final关键字--浅析

    final基本用法: 修饰类,类不能被继承 修饰方法,方法不能被重写 修饰变量,变量变常量,不可修该 对于一个final变量,如果是基本数据类型的变量,则其数值一旦在初始化之后便不能更改:如果是引用类 ...

  7. web-day9

    第9章WEB09-Servlet篇 今日任务 完成系统的登录的功能 完成登录系统后页面定时跳转 记录系统登录成功后,系统被访问多少次 教学导航 教学目标 了解HTTP协议 掌握Servlet的编写 了 ...

  8. 第一次Java实验

      模仿JavaAppArguments.java实例,编写一个程序,此程序从命令行接受多个数字,求和之后输出. 1.设计思路:命令行参数都是字符串,必须将其转化成数字才能相加,定义一个数组接收字符串 ...

  9. java poi 合并单元格

    java poi 合并单元格 2017年03月29日 16:39:01 翠烟你懊恼 阅读数:26561   版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.n ...

  10. AngularJS config run 及区别和例子

    一.config方法 在模块加载阶段,对模块进行自定义配置 config可以注入$stateProvider, $urlRouterProvider, $controllerProvider, $pr ...