Problem with posting data to Web API

Midhun Tp

9y1.1k

Hi All,

I have a web api which has a Post method in it.

So from another webpage i'm posting json data to this API using jquery ajax as below -

$.ajax({
type: "POST",
url: "http://localhost:4046/Values/Mymethods",
data: jsondata,
dataType: 'json'
}).complete(function (msg) {
});

This is working fine and getting the result from API.

The issue happens when I add an custom header in to this as below -

$.ajax({
type: "POST",
url: "http://localhost:4046/Values/Mymethods",
data: jsondata,
dataType: 'json',
header: { 'Token': 'asasaad' }
}).complete(function (msg) {
});

Now this is throwing cross domain error like below -

XMLHttpRequest cannot load http://localhost:4046/Values/My methods. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:2769' is therefore not allowed access. The response had HTTP status code 405.

I have provided header in web.config

I have created Web API in MVC 4.

Hope someone has got an solution for this.

Thanks in advance.

3 Replies

Know the answer? Post it — somebody with the same question will find it here.

Gnanavel Sekar9y ago
Welcome and Thank you Midhun T P
Midhun Tp9y ago
Hi Gnanavel Sekar,

Thanks for the help bro.

Unfortunately, the first two solutions didn't worked for me.

3rd one is not feasible, as it is much difficult to change the json data from object to array as this is already implemented in many projects.

For 4th solution, I think it has to be Web API 2.

Anyways I really appreciate your help.

I just got the solution from below article -

http://www.c-sharpcorner.com/UploadFile/jagdev1234/cross-domain-Asp-Net-web-api-post-data-using-jquery-ajax/
Gnanavel Sekar9y ago
Hi Midhun T P

solution 1:(it's not header)Change header to headers

$.ajax({
type: "POST",
url: "http://localhost:4046/Values/Mymethods",
data: jsondata,
dataType: 'json',
headers: { 'Token': 'asasaad' }
}).complete(function (msg) {
});

solution 2:
Enable cross domain

$.ajax({
type: "POST",
url: "http://localhost:4046/Values/Mymethods",
data: jsondata,
dataType:'jsonp',
crossDomain:true,
headers: { 'Token': 'asasaad' }
}).complete(function (msg) {
});

solution 3:
set json data as array not as object -->web-api(global.asax.cs)
protected void Application_Start()
{
GlobalConfiguration.Configure(WebApiConfig.Register);
log4net.Config.XmlConfigurator.Configure(new FileInfo(Server.MapPath("~/Log4Net.config")));
GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings
.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore;
GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings
.PreserveReferencesHandling = Newtonsoft.Json.PreserveReferencesHandling.Arrays;
GlobalConfiguration.Configuration.Formatters
.Remove(GlobalConfiguration.Configuration.Formatters.XmlFormatter);
}

solution 4:
https://docs.microsoft.com/en-us/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api

if help you out, mark as answer