实际: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. VirtualBox 扩展包卸载或安装失败(VERR_ALREADY_EXISTS)(转)

    文章出处:http://blog.csdn.net/leshami/article/details/9232229 最近在卸载VirtualBox出现了无法卸载的错误.提示为Failed to ins ...

  2. Qt 4.8.2.+VS2008静态编译

    一.下载Qt 4.8.2-opensource. 二.解压到C:\Qt\4.8.2_static 修改C:\Qt\4.8.2_static\projects.pro文件,删除demos,doc,exa ...

  3. 应用通信-方案二:Feign

    ------------------客户端controller层--------------------- @RestController public class ClientFeignContro ...

  4. 归一化(softmax)、信息熵、交叉熵

    机器学习中经常遇到这几个概念,用大白话解释一下: 一.归一化 把几个数量级不同的数据,放在一起比较(或者画在一个数轴上),比如:一条河的长度几千甚至上万km,与一个人的高度1.7m,放在一起,人的高度 ...

  5. 这可能是最好的RxJava 2.x 入门教程(一)

    这可能是最好的 RxJava 2.x 入门教程系列专栏 文章链接: 这可能是最好的 RxJava 2.x 入门教程(完结版)[重磅推出] 这可能是最好的RxJava 2.x 入门教程(一) 这可能是最 ...

  6. shell中空格的使用;空格替换;通配符

    测试: test $? -eq && echo "yes" || echo "no" 通配符: 通配符 ()*:0个或多个连续的字符 ()?:任 ...

  7. Spring---面向切面编程(AOP模块)

    Spring AOP 简介 如果说 IoC 是 Spring 的核心,那么面向切面编程就是 Spring 最为重要的功能之一了,在数据库事务中切面编程被广泛使用. AOP 即 Aspect Orien ...

  8. .NET 并行编程——任务并行

    本文内容 并行编程 任务并行 隐式创建和运行任务 显式创建和运行任务 任务 ID 任务创建选项 创建任务延续 创建分离的子任务 创建子任务 等待任务完成 组合任务 任务中的异常处理 取消任务 Task ...

  9. packageOfficialDebug和resourceFile does not exist.

    Android Studio运行时候报packageOfficialDebug错误 报错信息为 Error:A problem was found with the configuration of ...

  10. RHEL磁盘修复

    0. 1.基础工具:e2label /device/xxx [new label name]   显示/设定设备的label名称 2.e2fsck 修复工具,用-b 指定备用的superblock位置 ...