在不同域之间访问是比较常见,在本地调试访问远程服务器。。。。这就是有域问题。

VUE解决通过proxyTable:

在 config/index.js 配置文件中

  dev: {
env: require('./dev.env'),
port: 8080,
autoOpenBrowser: true,
assetsSubDirectory: 'static',
assetsPublicPath: '/',
//proxyTable: {},
proxyTable: proxyConfig.proxyList,
// CSS Sourcemaps off by default because relative paths are "buggy"
// with this option, according to the CSS-Loader README
// (https://github.com/webpack/css-loader#sourcemaps)
// In our experience, they generally work as expected,
// just be aware of this issue when enabling this option.
cssSourceMap: false
}

划红线部分就是设置代理参数:

在config目录创建,proxyConfig.js 写入

module.exports = {
proxyList: {
'/apis': {
// 测试环境
target: 'https://goods.footer.com', // 接口域名
changeOrigin: true, //是否跨域
pathRewrite: {
'^/apis': '' //需要rewrite重写的,
}
}
}
}

在 config/index.js 配置文件上边引入

var proxyConfig = require('./proxyConfig')
 

使用:

服务器提供接口:

https://goods.footer.com/health/list

Vue请求

var obj = {
pageSize: 20
}
this.$http.get( '/apis/health/list',{params: obj})
.then(function(res){
// 成功回调
},function(){
alert("error")
})

vue proxyTable 接口跨域请求调试的更多相关文章

  1. vue proxyTable 接口跨域请求调试(五)

    在不同域之间访问是比较常见,在本地调试访问远程服务器....这就是有域问题. VUE解决通过proxyTable: 在 config/index.js 配置文件中 dev: { env: requir ...

  2. Vue-接口跨域请求调试proxyTable

    在项目开发的时候,接口联调的时候一般都是同域名下,且不存在跨域的情况下进行接口联调,但是当我们现在使用vue-cli进行项目打包的时候,我们在本地启动服务器后,比如本地开发服务下是 http://lo ...

  3. vue 使用axios 跨域请求数据的问题

    axios默认是没有jsonp 跨域请求的方法的.一般来说流行的做法是将跨域放在后台来解决,也就是后台开发人员添加跨域头信息. 例如java中的 header,response.setHeader(& ...

  4. $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)

    1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...

  5. vue开发之跨域请求,请求头not allowed by Access-Control-Allow-Headers,后端cookie session值取不到(二)

    原因:你本地的请求ajax的get和post请求:如果你的请求头内放一些可用验证数据Token的时候就会存在跨域请求这是浏览器所不允许的问题: 方案一:后台的接口请求模式都写成jsonp请求,前端去调 ...

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

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

  7. 让新版Chrome支持本地跨域请求调试

    1.创建一个Chrome的启动快捷方式: 2.右键点击快捷方式属性,然后在目标路径后面,添加以下参数: --disable-web-security --user-data-dir="e:\ ...

  8. Vue ajax跨域请求

    Vue webpack-dev-server实现跨域请求 思路 配置webpack-dev-server,代理某一个路径到目标路径,同是更改源和重写 Vue里定义一个全部变量:site Vue.pro ...

  9. VUE系列三:实现跨域请求(fetch/axios/proxytable)

    1. 在 config/index.js 配置文件中配置proxyTable 'use strict' // Template version: 1.3.1 // see http://vuejs-t ...

随机推荐

  1. Delphi 工具条按钮上的下拉菜单

    制作步骤: 1.添加一个 TImageList: ImageList1, 然后载入些图标; 2.添加两个 TPopupMenu: PopupMenu1.PopupMenu2, 并分别添加些菜单项; 3 ...

  2. hdu-4300(kmp或者拓展kmp)

    题意:乱七八糟说了一大堆,就是先给你一个长度26的字符串,对应了abcd....xyz,这是一个密码表.然后给你一个字符串,这个字符串是不完整的(完整的应该是前半部分是加密的,后半部分是解密了的),然 ...

  3. 【数模】day06-数理统计I

    数理统计. 以样本推断总体,进而用总体研究问题. 分两部分学习,第一部分是基础统计.参数估计.假设检验以及bootstrap方法. 1. 基础统计 假设有如下数据: 要做频数表.直方图.折线图.饼状图 ...

  4. java基础之Number

    1.Java是一个近乎纯洁的面向对象编程语言,但是为了编程的方便还是引入了基本数据类型,但是为了能够将这些基本数据类型当成对象操作,Java为每一个基本数据类型都引入了对应的包装类型(wrapper ...

  5. h5 打开 app

    目前只支持在浏览器中打开,如果非浏览器,例如 微信 支付宝 钉钉 第三方 app 中会弹出下载页面 schemeUrl 为 和app 约定url   openApp() { /* 小希学生端 aoji ...

  6. The Cow Lexicon POJ - 3267 dp

    题意  给出一个母串  和一个字典 问母串最少删去几个字母     删去后的母串是由字典里面的单词拼起来的 思路:dp[i]表示从i到母串结尾最少需要删除多少个字母  初始化dp[length]=0 ...

  7. BZOJ3105 新Nim游戏 【拟阵】

    题目分析: 我不知道啥是拟阵啊,但有大佬说线性基相关的都是拟阵,所以直接贪心做了. 题目代码: #include<bits/stdc++.h> using namespace std; ; ...

  8. [USACO07JAN]Cow School

    题目链接:[USACO07JAN]Cow School 一开始还以为是一道分数规划,后来发现自己看错题了, 然后成功入坑 题目是要求先按照$t_i/p_i$从小到大排序,然后删除前$d$个后求出剩下的 ...

  9. 【转】让浏览器格式化显示JSON数据之chrome jsonView插件安装

    jsonView 用来让Chrome浏览器能格式化的显示JSON数据. 以上是网上找的方式,且试验成功! 步骤: 1.打开 https://github.com : 2.搜索 jsonView 链接: ...

  10. Postman的一个使用技巧----设置环境变量

    相同的api接口因为部署环境不同,分为test和pre_production 打开Postman,建两个测试集,分别测试测试环境test和演练环境pre_production 下面来介绍一下Postm ...