阅读:11285回复:0
vue中post请求变options请求
描述:
原本使用vue中的代理跨域,post请求正常. 然后,取消post请求,在服务器端(node),使用cors来解决跨后问题 问题: 在设置cors来跨域后,post请求变成了options请求,并且,提示error: Access to XMLHttpRequest at 'http://192.168.1.229:8888/productList.do' from origin 'http://localhost:63342' has been blocked by CORS policy: Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response. 可查看问题原因的具体描述 :https://blog.csdn.net/xuedapeng/article/details/79076704 代码如下: this.$axios.post("http://192.168.1.229:8888/productList.do",{username:'wawawahahha',pwd:"123456"}).then((response) =>{ console.log(response); this.productList = response.data; }).catch((error)=>{ console.log(error); });解决方案: 给请求添加一个请求头 代码如下: let config = { headers : { 'Content-Type':'application/x-www-form-urlencoded' }, }; ///static/product.json this.$axios.post("http://192.168.1.229:8888/productList.do",{username:'wawawahahha',pwd:"123456"},config).then((response) =>{ console.log(response); this.productList = response.data; }).catch((error)=>{ console.log(error); });解析: 报文变成了OPTION包,而不是POST请求报文。 这叫做预检报文,如何不触发预检报文,有三个同时满足的必备条件(三项均成立才行): 参考:https://www.cnblogs.com/KevinGeorge/p/7701153.html |
|