设置请求头部
- 后端设置请求头部
Access-Control-Allow-Credentials: true和Access-Control-Allow-Origin: www.xxx.com - 前端post请求设置
withCredentials=true - 这里用了axios的请求数据方法代码如下：
if (!uri) {
console.error('API function call requires uri argument')
return
}
console.error('API function call requires uri argument')
return
}
let url = config.serverURI + uri
return axios({ method,url,...headerConfig })
}
}
jQuery的$.ajax:：
{
// balabala...
})
使用nodejs做代理
- 上面的那种方法需要后端配合设置头部，对于我这种前端小白来讲，联调时各种不成功的报错也无从解决，所以个人比较倾向于下面这种做法，鉴于使用脚手架vue-cli创建的项目，作者已经给我提供好了解决的方法。
- 找到项目文件夹下的config/index.js,里面有一行proxyTable: {},这里就是作者为我们留的接口,我们添加代理规则进去
PHP/',changeOrigin: true,pathRewrite: {
'^/api': '/'
}
}
},cssSourceMap: false
}
}
这里target为目标域名，pathRewrite为转换规则，请求数据时将接口地址 根据转换规则请求就可以解决跨域啦！（这里也可以配置headers，设置cookis，token等）
jsonp
jsonp也是一种解决跨域的方法，不过我从来没有用过，在网上查了下资料，jsonp的原理是script标签引入js是不受域名限制的,由于是模拟插入script标签,所以不可以用post请求。
原文链接：https://www.f2er.com/vue/38818.html