实际:http://a.com/b.php

代理:http://localhost/b.php

配置config/index.js

proxyTable: {
'/api': {
target:'http://a.com',
changeOrigin: true,
pathRewrite: {
'^/api': '/'
}
}
}

在main.js中:

import axios from 'axios'
Vue.prototype.axios = axios
axios.defaults.baseURL = '/api'

在组件中使用:

this.axios.get('/n.php').then((data) => {
// 处理数据
})

仅限于开发环境,生产环境仍然需要服务端设置允许跨域

vue跨域代理配置的更多相关文章

  1. 前端本地proxy跨域代理配置

    等了好久的接口,总算拿到了,结果却发现用本地localhost:9712去请求接口的时候,出现了跨域错误,而这个时候我们就需要进行下跨域配置了. 首先,找到项目中名为webpack.config.js ...

  2. axios,vue-echarts, async, vue 图表数据处理; axios 跨域代理; 异步同步请求接口;生命周期函数

    1.vue-echarts 安装和组件引用 插件官网 https://github.com/ecomfe/vue-echarts 安装 npm install eacharts vue-echarts ...

  3. nginx反向代理跨域基本配置与常见误区

    最近公司前后端分离,前端独立提供页面和静态服务很自然的就想到了用nginx去做静态服务器.同时由于跨域了,就想利用nginx的反向代理去处理一下跨域,但是在解决问题的同时,发现网上有些方案的确是存在一 ...

  4. eclipse加速/Nginx配置跨域代理

    下班时间到啦! --下班都是他们的,而我,还是什么都没有. eclipse加速 去掉包含js文件的包的js验证,否则每次启动都需要进行校验(右击项目->properties) Nginx配置跨域 ...

  5. Next.js 配置接口跨域代理转发

    使用 create-next-app 创建的 Next.js 项目配置接口跨域代理转发需要用到 custom server 功能. 先安装好 express 和 http-proxy-middlewa ...

  6. vue跨域问题解决(生产环境)

    vue跨域问题解决(使用webpack打包的) 配置代理:(config下index.js文件) module.exports = { dev: { env: require('./dev.env') ...

  7. React网络请求跨域代理设置

    之前的之所以可以请求其他域名下的网络数据,是因为我们在服务端设置了相关配置,如下所示 如果将其注释掉,再次测试,如下所示 此时便无法跨域操作,接下来介绍下React如何实现跨域代理 (1)分析 Rea ...

  8. vue-cli 前端开发,后台接口跨域代理调试问题

    使用 webpack的方式开发的时候,前台开发过程中需要调用很多后台的数据接口,但是通常前后台分离的开发方式,后台的接口数据很可能是不方便或者是不能在前端同学的电脑上运行的,也就出现了所谓的跨域问题. ...

  9. nodejs之mock与跨域代理的三两事

    emmm...好久没写博客了,都忘了该怎么开始. 那就先说下mockjs.因为一些原因,导致后台接口没有数据,那么我们就开始自己造数据,使用的是比较流行mockjs,根据文档就能简单的配置,然后开始愉 ...

随机推荐

  1. ClassLoader加载资源时的搜索路径

    先来个例子: /** * 测试classloader加载路径在哪里<p> * main3 */ public static void main3(String[] args) { Prop ...

  2. java工具类,在Windows,Linux系统获取电脑的MAC地址、本地IP、电脑名

    package com.cloudssaas.util; import java.io.BufferedReader; import java.io.IOException; import java. ...

  3. PID控制器(比例-积分-微分控制器)- IV

    调节/测量放大电路电路图:PID控制电路图 如图是PlD控制电路,即比例(P).积分(I).微分(D)控制电路. A1构成的比例电路与环路增益有关,调节RP1,可使反相器的增益在0·5一∞范围内变化; ...

  4. ADC分类及参数

    ADC分类 直接转换模拟数字转换器(Direct-conversion ADC),或称Flash模拟数字转换器(Flash ADC) 循续渐近式模拟数字转换器(Successive approxima ...

  5. 用 Prettier 统一团队的代码风格~

    使用 prettier 自動調整 JavaScript 樣式 GFM 格式说明 为什么你不能缺少Linter(以及代码美化工具) 使用 prettier 自動調整 JavaScript 樣式 Reac ...

  6. ThinkPhp 更改 BIT 类型的问题

    在使用ThinkPhp更改字段为BIT 类型的注意了,您将会遇到以下错误信息:  这是因为ThinkPhp在使用setField或Save方法时,将你的值更改成了字符串类型 而TINYINT 类型是不 ...

  7. 微软BI 之SSRS 系列 - 使用文档结构导航报表元素 Document Map

    在 SSRS 中也有类似于 Word 文档中的那种导航的效果 - 左侧部分,可以通过导航地图快速的定位到国家下的省份或者城市,并且这种层次结构是由在创建行分组时定义的. 比如说下面的这个例子中,我分了 ...

  8. ceph 底层代码分享

    一.底层工作队列 二.对象操作 三.上下文(Context)代码分析:

  9. 【LeetCode-面试算法经典-Java实现】【062-Unique Paths(唯一路径)】

    [062-Unique Paths(唯一路径)] [LeetCode-面试算法经典-Java实现][全部题目文件夹索引] 原题 A robot is located at the top-left c ...

  10. SNF快速开发平台MVC-EasyUI3.9之-DataGrid表格控件如何增加右键菜单

    如题,我们在项目开发当中会遇到需要,表格控件增加右键菜单的使用. 下面我们就以SNF框架增加右键菜单步骤如下: 1.在加载页面当中增加如下菜单定义 <div id="mm" ...