vue - (axios与vue-resource)

今天我们来讲讲vue中调api的两种常见方法。

由于vue2.0开始，对vue-resource不在维护更新。所以导致很多人开始入坑axios。

当我用起了axios，嗯，它是真的坑。最坑的是它不支持跨域。

如果你项目打包上线依旧需要跨域，我劝你就不要用axios 了 ，会把自己坑死的。（这时候就可以用vue-resource）

但是如果只是在环境上测试，你可以使用 proxyTable代理。

具体使用如下，找到config文件夹中的index.js文件：

proxyTable: {
            '/api':{
                target:'https://api.douban.com',
                changeOrigin:true,
                pathRewrite:{
                    '/api':''
                }
            }
        }

调用时：

that.$axios.post('/api//v2/movie/top250').then(function(response){console.log(response.data);
  }).catch(function(error){
   console.log(error);
 });

这里就相当于用 /api  == https://api.douban.com

但是如果打包后还是要实现跨域，那么用vue - resource 吧，小伙子别执着了。

vue - reource 安装步骤

 1. npm install vue-resource --save

 2. 找到main.js　

　　import  VueResource  from 'vue-resource'

　　Vue.use(VueResource)

跨域调用：

that.$http.jsonp("http://xxxxxxxxxxx",{params:{"callback":"jsonPCallback"}}).then(function(response){
                    console.log(response.body);
                });

ok，收工。

 

转载于:https://www.cnblogs.com/lafitewu/p/8780450.html