How to get Location Header in jquery success in a cross origin request

Sachin Singh

the web api post method is setting location header like below

public HttpResponseMessage Post([FromBody]Employee emp)
{
try
{
db.Employees.Add(emp);
db.SaveChanges();
var msg = Request.CreateResponse(HttpStatusCode.Created, emp);
msg.Headers.Location = new Uri(Request.RequestUri +"/"+ emp.Id.ToString());
return msg;
}
catch
{
return new HttpResponseMessage(HttpStatusCode.InternalServerError);
}
}

fiddler successfully recognized the location

Its a cross origin request , so xhr doesn't include all headers untill you force it to set additional headers in "Access-Control-Expose-Headers" , so i had to set this like below

$.ajax({
"type": "Post",
"url": myUrl,
"dataType": "json",
"contentType": "application/json;charset=utf-8",
"data": JSON.stringify(model),
"traditional": true,
"dataTpe": "Json",
"headers": {
"Access-Control-Expose-Headers": "location",
},
"cache": false,
"crossDomain": true,
"success": function (data,status,xhr) {
debugger;
alert(xhr.getResponseHeader('Location'));
},
"error": function (request, message, error) {
handleException(request, message, error);
}

but no luck , getting null in alert.

2 Replies

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

Sachin Singh6y ago
After a huge research i found the solution ,
By default, the browser does not expose all of the response headers to the application. The response headers that are available by default are:

Cache-Control

Content-Language

Content-Type

Expires

Last-Modified

Pragma

In order to include other headers we have to set the set the exposedHeaders parameter of [EnableCors].
Like below:-

[EnableCors(origins: "*", headers: "*", methods: "*",exposedHeaders:"Location", SupportsCredentials = true)]

Previously , my controller only had [EnableCors(origins: "*", headers: "*", methods: "*", SupportsCredentials = true)]
Nisha Regil6y ago
Please refer the links below.

May be they would be helpful.

https://medium.com/@jsguyhenry/how-to-read-get-response-header-from-ajax-http-service-api-call-or-response-c873c5fbf9b8

https://www.yukei.net/2016/01/getting-response-headers-data-from-an-ajax-request-with-jquery/

https://medium.com/@stevemillerdotdev/getting-response-headers-with-the-javascript-fetch-api-799c83c6480e