Vue/Vue2 跨域

Question

1. jsonp

1. npm install vue-resource -save
2. 在 routes\index.js 中引入并注册该组件

   import VueResource from 'vue-resource'
   Vue.use(VueResource);
   

1. 使用 vue-resource 的 jsonp() 方法

   jsonp() 不能发送 post 请求，不管是否跨域，只要用 jsonp() 方式则该请求一定是 get 方式，因为本质是 script 方式加载的

   this.$http.jsonp('/someUrl', [data], [options]).then(successCallback, errorCallback);
   

2. 更改服务器代码

//跨域设置，此代码要在所有的路由路径配置之前执行，否则代码之前定义的路由不接受此跨域的头部配置
app.all('*', function (req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization ,Accept ,X-Requested-With, yourHeaderFeild');
    res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
    if (req.method == 'OPTIONS') {
        res.send(200); //让 OPTIONS 请求快速返回
    } else {
        next();
    }
});
app.use('/', indexRouter);