Axios POST返回"Network Error"(网络错误).即使状态为200并且有回应 [英] Axios POST returns "Network Error" even if status is 200 and there's a response
问题描述
我在Axios上使用Vue JS 2.5:
I'm using Vue JS 2.5 with Axios:
"vue": "^2.5.17",
"vue-axios": "^2.1.4",
"axios": "^0.18.0",
我正尝试拨打POST呼叫,就像这样:
I'm trying to make a POST call just like this:
const data = querystring.stringify({
'email': email,
'password': password,
'crossDomain': true, //optional, added by me to test if it helps but it doesn't help
});
var axiosConfig = {
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
// "Access-Control-Allow-Origin": "*",
'Accept': '*',
}
};
axios.post(url, data, axiosConfig)
.then((response) => {
console.log('response');
console.log(response);
})
.catch((error) => {
console.log('error');
console.log(error);
});
我也尝试了没有"axiosConfig"参数的情况.但是每次进入陷阱时,都会显示以下消息:错误:网络错误
I tried also without the "axiosConfig" parameter. But everytime it enters on the catch, with the message: Error: Network Error
在浏览器的网络"选项卡中,我的状态为200,响应良好(带有有效的json),基本上可以运行,但是Axios返回错误且没有响应.
In the browser's Network tab I get a 200 status and a good Response (with a valid json), it basically works but Axios returns error and no response.
控制台还会输出以下警告:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://url/api/page. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
The console also outputs this warning: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://url/api/page. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
我试图打给邮递员同样的电话,而且效果很好.区别在于Axios使用我的本地主机:8080发送标头:"Origin"和"Referrer",这与我要调用的API URL不同.
I tried to make the same call from Postman and it works well. The difference is that Axios is sending the headers: "Origin" and "Referrer" with my localhost:8080, which is different than the API url that I'm calling.
如何在没有出现此错误的情况下从axios发出此呼叫?谢谢.
How can I make this call from axios without getting this error? Thanks.
编辑
如果我使用PHP,它就可以工作:
It works if I'm using PHP:
$curl = curl_init();
curl_setopt_array($curl, array(
CURLOPT_URL => "https://myurl",
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => "",
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 30,
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => "POST",
CURLOPT_POSTFIELDS => "------WebKitFormBoundaryTrZu0gW\r\nContent-Disposition: form-data; name=\"email\"\r\n\r\nemail\r\n------WebKitFormBoundaryTrZu0gW\r\nContent-Disposition: form-data; name=\"password\"\r\n\r\npassword\r\n------WebKitFormBoundaryTrZu0gW--",
CURLOPT_HTTPHEADER => array(
"Postman-Token: 62ad07e5",
"cache-control: no-cache",
"content-type: multipart/form-data; boundary=----WebKitFormBoundaryTrZu0gW",
"email: email",
"password: password"
),
));
$response = curl_exec($curl);
$err = curl_error($curl);
curl_close($curl);
if ($err) {
echo "cURL Error #:" . $err;
} else {
echo $response;
}
我只是复制粘贴了生成的Postman呼叫,并从另一个页面尝试了它,因此效果很好.因此,这不是CORS问题,而是我的Javascript调用问题.
I just copy-pasted the generated Postman call and tried it from a different page and it works well. So it's not a CORS problem, it's a problem with my Javascript call.
推荐答案
您需要在API上启用CORS,您使用的是哪种语言/框架?
You need to enable CORS on your API, which language/framework are you using?
这里有一些参考资料:
这篇关于Axios POST返回"Network Error"(网络错误).即使状态为200并且有回应的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!