Vue脚手架,通过api获取后台数据
情况:api项目,vue项目都在本机运行,vue通过调用接口,获取数据问题难点:牵涉到跨域问题vue代码:点击按钮调用regist方法,获取http://192.168.1.233/api/bargain/list数据methods: {regist:function() {//this.$http.get("http://192.168.1.233/api/regi...
·
情况:api项目,vue项目都在本机运行,vue通过调用接口,获取数据
问题难点:牵涉到跨域问题
vue代码:点击按钮调用regist方法,获取http://192.168.1.233/api/bargain/list数据
methods: {
regist:function() {
//this.$http.get("http://192.168.1.233/api/register/register?mobile=" +this.mobile+"&password="+this.password);
//this.$http.get("http://192.168.1.233/api/register/register",{params: {mobile: this.mobile,password: this.password}},{datatype:'json'}).then(successCallback, errorCallback);
this.$http.get("/api/bargain/list").then(function (res) {
this.data1 = res.data.data.data;
},function (res) {
alert("shibai");
});
},
login() {
alert('登录成功!');
this.thisuser=this.mobile;
}
跨越:vue脚手架的config--index.js--proxyTable中添加
'/api': { target: 'http://192.168.1.233',//vue要请求的api地址 changeOrigin: true, pathRewrite: { '^/api': '/api'//对应this.$http.get("/api/bargain/list") } }
注意:跨越成功的结果
原本要访问的是http://192.168.1.233/api/bargain/list
实际访问的是http://vue项目的运行地址/api/bargain/list
相当于把所有的192.168.1.233上的api 同步到了vue所在的地址
更多推荐
已为社区贡献1条内容
所有评论(0)