admin管理员组文章数量:1022935
I'm trying to do a POST ajax request to C# WebAPI, but I can't seem to get any information back.
When I click a button on my site, I can see the server passing back the this error:
"NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'http://120.96.86.139/api/SingleLoginPOST/'."
I already Add Header：
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
How can I fix this problem.Thanks.
Code:
var ip;
$.get("", function(response) {
ip = response.ip;
console.log(ip);
}, "jsonp");
$(document).ready(function() {
$(document).on('click', '#loginbtn', function() {
var username = $("input#inpAcc").val();
var password = $("input#inpPwd").val();
var lenthl = $("input#inpAcc").val().lenth;
if (username != "") {
if (password != "") {
var data = {
Acc: username,
Pwd: password,
ip: ip
};
var dataRes = JSON.stringify(data);
var APIurl = "http://120.96.86.139/api/SingleLoginPOST/";
$.ajax({
async: false,
headers: {
"cache-control": "no-cache"
},
contentType: 'application/jsonp; charset=utf-8',
type: "POST",
data: dataRes,
dataType: "JSON",
dataType: 'json',
crossDomain: true,
url: APIurl,
async: false,
withCredentials: true,
contentType: 'application/jsonp; charset=utf-8',
headers: {
"Content-Type": "application/json",
"X-HTTP-Method-Override": "POST"
},
error: function(xhr, status, p3, p4) {
var err = "Error " + " " + status + " " + p3;
console.log(xhr);
console.log(status);
console.log(p3);
console.log(p4);
if (xhr.responseText && xhr.responseText[0] == "{")
err = JSON.parse(xhr.responseText).message;
console.log(err);
},
success: function(data) {
var i = 0;
$.each(data, function(key, value) {
window.sessionStorage["ACC"] = username;
window.sessionStorage['PWD'] = password;
window.sessionStorage['NAME'] = value.name;
window.location.assign("PersonMenu.html");
console.log(value.name);
console.log(data.message);
console.log(data.html);
})
}
});
} else {
alert("P");
}
} else {
alert("A");
}
});
});<script src=".9.1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
<div class="form" id="form">
<form class="login-form" method="POST">
<input type="text" id="inpAcc" placeholder="Account" />
<input type="password" id="inpPwd" placeholder="Password " />
<input id="loginbtn" type="button" value="login" />
</form>
</div>I'm trying to do a POST ajax request to C# WebAPI, but I can't seem to get any information back.
When I click a button on my site, I can see the server passing back the this error:
"NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'http://120.96.86.139/api/SingleLoginPOST/'."
I already Add Header：
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
How can I fix this problem.Thanks.
Code:
var ip;
$.get("http://ipinfo.io", function(response) {
ip = response.ip;
console.log(ip);
}, "jsonp");
$(document).ready(function() {
$(document).on('click', '#loginbtn', function() {
var username = $("input#inpAcc").val();
var password = $("input#inpPwd").val();
var lenthl = $("input#inpAcc").val().lenth;
if (username != "") {
if (password != "") {
var data = {
Acc: username,
Pwd: password,
ip: ip
};
var dataRes = JSON.stringify(data);
var APIurl = "http://120.96.86.139/api/SingleLoginPOST/";
$.ajax({
async: false,
headers: {
"cache-control": "no-cache"
},
contentType: 'application/jsonp; charset=utf-8',
type: "POST",
data: dataRes,
dataType: "JSON",
dataType: 'json',
crossDomain: true,
url: APIurl,
async: false,
withCredentials: true,
contentType: 'application/jsonp; charset=utf-8',
headers: {
"Content-Type": "application/json",
"X-HTTP-Method-Override": "POST"
},
error: function(xhr, status, p3, p4) {
var err = "Error " + " " + status + " " + p3;
console.log(xhr);
console.log(status);
console.log(p3);
console.log(p4);
if (xhr.responseText && xhr.responseText[0] == "{")
err = JSON.parse(xhr.responseText).message;
console.log(err);
},
success: function(data) {
var i = 0;
$.each(data, function(key, value) {
window.sessionStorage["ACC"] = username;
window.sessionStorage['PWD'] = password;
window.sessionStorage['NAME'] = value.name;
window.location.assign("PersonMenu.html");
console.log(value.name);
console.log(data.message);
console.log(data.html);
})
}
});
} else {
alert("P");
}
} else {
alert("A");
}
});
});<script src="https://ajax.googleapis./ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
<div class="form" id="form">
<form class="login-form" method="POST">
<input type="text" id="inpAcc" placeholder="Account" />
<input type="password" id="inpPwd" placeholder="Password " />
<input id="loginbtn" type="button" value="login" />
</form>
</div>WEBAPI：
1.WebConfig
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<!--<add name="Access-Control-Allow-Headers" value="Content-Type" />-->
<add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>
2.Controller
public class SingleLoginPostController : ApiController
{
[HttpPost][HttpGet][HttpOptions][HttpDelete][HttpPut]
public List<SingleLoginModel> SingleLoginPost([FromBody] SingleLoginPostModel SingleLoginPost)
{
//...........
}
}
3.Model
public class SingleLoginModel
{
public string no { set; get; }
public string name { set; get; }
public string dept { set; get; }
public string titel { set; get; }
public string ret { set; get; }
public string strError { set; get; }
}
public class SingleLoginPostModel
{
public string Acc { set; get; }
public string Pwd { set; get; }
public string ip { set; get; }
}
-
The response needs to list all of the request headers in the
Access-Control-Allow-Headersheader. It looks like it's not includingX-HTTP-Method-Overrideone. – Tom Commented Mar 3, 2017 at 9:27 - @thebluefox you mean " http-equiv="Access-Control-Allow-Methods" content="POST,GET,PUT"" ?? – Shuan-han Chen Commented Mar 3, 2017 at 9:38
- No, I mean what I've just said. See this question/answer. I'm talking about allowed headers, not allowed methods. – Tom Commented Mar 3, 2017 at 9:42
- 1 U need to install the Microsoft.AspNet.WebApi.Cors package. Here's a good doxs on that learn.microsoft./en-us/aspnet/web-api/overview/security/… – Marcus Höglund Commented Mar 3, 2017 at 11:02
- @MarcusH HI,but I can't install "Microsoft.AspNet.WebApi.Cors" – Shuan-han Chen Commented Mar 7, 2017 at 0:46
2 Answers
Reset to default 0add this line to web service attributes
[System.Web.Script.Services.ScriptService]
maybe you can change your ajax async:false to async:true or delete async because it's default true
I'm trying to do a POST ajax request to C# WebAPI, but I can't seem to get any information back.
When I click a button on my site, I can see the server passing back the this error:
"NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'http://120.96.86.139/api/SingleLoginPOST/'."
I already Add Header：
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
How can I fix this problem.Thanks.
Code:
var ip;
$.get("", function(response) {
ip = response.ip;
console.log(ip);
}, "jsonp");
$(document).ready(function() {
$(document).on('click', '#loginbtn', function() {
var username = $("input#inpAcc").val();
var password = $("input#inpPwd").val();
var lenthl = $("input#inpAcc").val().lenth;
if (username != "") {
if (password != "") {
var data = {
Acc: username,
Pwd: password,
ip: ip
};
var dataRes = JSON.stringify(data);
var APIurl = "http://120.96.86.139/api/SingleLoginPOST/";
$.ajax({
async: false,
headers: {
"cache-control": "no-cache"
},
contentType: 'application/jsonp; charset=utf-8',
type: "POST",
data: dataRes,
dataType: "JSON",
dataType: 'json',
crossDomain: true,
url: APIurl,
async: false,
withCredentials: true,
contentType: 'application/jsonp; charset=utf-8',
headers: {
"Content-Type": "application/json",
"X-HTTP-Method-Override": "POST"
},
error: function(xhr, status, p3, p4) {
var err = "Error " + " " + status + " " + p3;
console.log(xhr);
console.log(status);
console.log(p3);
console.log(p4);
if (xhr.responseText && xhr.responseText[0] == "{")
err = JSON.parse(xhr.responseText).message;
console.log(err);
},
success: function(data) {
var i = 0;
$.each(data, function(key, value) {
window.sessionStorage["ACC"] = username;
window.sessionStorage['PWD'] = password;
window.sessionStorage['NAME'] = value.name;
window.location.assign("PersonMenu.html");
console.log(value.name);
console.log(data.message);
console.log(data.html);
})
}
});
} else {
alert("P");
}
} else {
alert("A");
}
});
});<script src=".9.1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
<div class="form" id="form">
<form class="login-form" method="POST">
<input type="text" id="inpAcc" placeholder="Account" />
<input type="password" id="inpPwd" placeholder="Password " />
<input id="loginbtn" type="button" value="login" />
</form>
</div>I'm trying to do a POST ajax request to C# WebAPI, but I can't seem to get any information back.
When I click a button on my site, I can see the server passing back the this error:
"NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'http://120.96.86.139/api/SingleLoginPOST/'."
I already Add Header：
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
How can I fix this problem.Thanks.
Code:
var ip;
$.get("http://ipinfo.io", function(response) {
ip = response.ip;
console.log(ip);
}, "jsonp");
$(document).ready(function() {
$(document).on('click', '#loginbtn', function() {
var username = $("input#inpAcc").val();
var password = $("input#inpPwd").val();
var lenthl = $("input#inpAcc").val().lenth;
if (username != "") {
if (password != "") {
var data = {
Acc: username,
Pwd: password,
ip: ip
};
var dataRes = JSON.stringify(data);
var APIurl = "http://120.96.86.139/api/SingleLoginPOST/";
$.ajax({
async: false,
headers: {
"cache-control": "no-cache"
},
contentType: 'application/jsonp; charset=utf-8',
type: "POST",
data: dataRes,
dataType: "JSON",
dataType: 'json',
crossDomain: true,
url: APIurl,
async: false,
withCredentials: true,
contentType: 'application/jsonp; charset=utf-8',
headers: {
"Content-Type": "application/json",
"X-HTTP-Method-Override": "POST"
},
error: function(xhr, status, p3, p4) {
var err = "Error " + " " + status + " " + p3;
console.log(xhr);
console.log(status);
console.log(p3);
console.log(p4);
if (xhr.responseText && xhr.responseText[0] == "{")
err = JSON.parse(xhr.responseText).message;
console.log(err);
},
success: function(data) {
var i = 0;
$.each(data, function(key, value) {
window.sessionStorage["ACC"] = username;
window.sessionStorage['PWD'] = password;
window.sessionStorage['NAME'] = value.name;
window.location.assign("PersonMenu.html");
console.log(value.name);
console.log(data.message);
console.log(data.html);
})
}
});
} else {
alert("P");
}
} else {
alert("A");
}
});
});<script src="https://ajax.googleapis./ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<meta http-equiv="Access-Control-Allow-Headers" content="Content-Type" />
<meta http-equiv="Access-Control-Allow-Methods" content="POST" />
<div class="form" id="form">
<form class="login-form" method="POST">
<input type="text" id="inpAcc" placeholder="Account" />
<input type="password" id="inpPwd" placeholder="Password " />
<input id="loginbtn" type="button" value="login" />
</form>
</div>WEBAPI：
1.WebConfig
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<!--<add name="Access-Control-Allow-Headers" value="Content-Type" />-->
<add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>
2.Controller
public class SingleLoginPostController : ApiController
{
[HttpPost][HttpGet][HttpOptions][HttpDelete][HttpPut]
public List<SingleLoginModel> SingleLoginPost([FromBody] SingleLoginPostModel SingleLoginPost)
{
//...........
}
}
3.Model
public class SingleLoginModel
{
public string no { set; get; }
public string name { set; get; }
public string dept { set; get; }
public string titel { set; get; }
public string ret { set; get; }
public string strError { set; get; }
}
public class SingleLoginPostModel
{
public string Acc { set; get; }
public string Pwd { set; get; }
public string ip { set; get; }
}
-
The response needs to list all of the request headers in the
Access-Control-Allow-Headersheader. It looks like it's not includingX-HTTP-Method-Overrideone. – Tom Commented Mar 3, 2017 at 9:27 - @thebluefox you mean " http-equiv="Access-Control-Allow-Methods" content="POST,GET,PUT"" ?? – Shuan-han Chen Commented Mar 3, 2017 at 9:38
- No, I mean what I've just said. See this question/answer. I'm talking about allowed headers, not allowed methods. – Tom Commented Mar 3, 2017 at 9:42
- 1 U need to install the Microsoft.AspNet.WebApi.Cors package. Here's a good doxs on that learn.microsoft./en-us/aspnet/web-api/overview/security/… – Marcus Höglund Commented Mar 3, 2017 at 11:02
- @MarcusH HI,but I can't install "Microsoft.AspNet.WebApi.Cors" – Shuan-han Chen Commented Mar 7, 2017 at 0:46
2 Answers
Reset to default 0add this line to web service attributes
[System.Web.Script.Services.ScriptService]
maybe you can change your ajax async:false to async:true or delete async because it's default true
本文标签： javascriptNetworkError Failed to execute 39send39 on 39XMLHttpRequest39 (ajaxWebAPI)Stack Overflow
版权声明：本文标题：javascript - NetworkError: Failed to execute 'send' on 'XMLHttpRequest' (ajax、WebAPI) - Stack Ov 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745593873a2158045.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论