Menu
My post method is something like this:
public HttpResponseMessage AddUser(User user)
{
UserManager userManager = new UserManager();
try
{
userManager.Create(user);
var savedUser = userManager.FindUserByClientId(user.ClientId);
HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.Created, user);
response.Headers.Location = new Uri(Url.Link("DefaultApi", new { id = savedUser.Id }));
return response;
}
catch(Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex.Message);
}
}
In angular, I am trying to read that Location header but so far I'm still not able to.
return $http.post('http://localhost:30028/api/values/adduser', user)
.success(function (data, status, headers, config) {
alert(angular.toJson(data));
alert(angular.toJson(status));
alert(angular.toJson(headers));
alert(angular.toJson(config));
};
I am just checking out the contents of each of those and none has the location header. Is there a way in angular to access the location header so that i know the url of my new object?
305
To check this Location in action go to Inspect Element -> Network check the response header for Location like below, Location is highlighted you can see.
To add headers for an HTTP method other than POST or PUT, simply add a new object with the lowercased HTTP method name as the key, e.g. $httpProvider. defaults. headers. get = { 'My-Header' : 'value' } .
$http is an AngularJS service for reading data from remote servers.
path([path]);Return path of current URL when called without any parameter. Change path when called with parameter and return $location . Note: Path should always begin with forward slash (/), this method will add the forward slash if it is missing.
According to the documentation, the headers object is actually a function that returns the header, like so:
.success(function(data, status, headers, config) {
alert( headers('Location') );
});
If you want a collection of all headers, you can do this:
.success(function(data, status, headers, config) {
console.log( headers() );
});
Note: If your server sets a response code of 301 or 302, you will not be able to get the Location header, as it will be automatically and transparently followed by the XMLHttpRequest object.
So, make sure you are correctly setting the response code. I was testing this in PHP (which I don't use as much), and had forgotten that setting a Location header automatically set the response code. To test this, I had to use:
header('Location: blah-blah', true, 200);
Here's my working code sample, just save it to location-test.php on a PHP server and run it:
<?php
if(isset($_GET['q'])) {
header('Content-Type: application/json');
header('Location: user/1', true, 200);
echo json_encode(array('query' => $_GET['q']));
} else {
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type='text/javascript' src='//cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.5/angular.min.js'></script>
<script type='text/javascript'>//<![CDATA[
angular.module('myApp', [])
.controller("myController", function($scope, $http) {
$scope.loc = "Loading...";
$http.get('location.php?q=hello')
.success(function (data, status, header, config) {
console.log(header());
$scope.loc = header('Location');
})
.error(function(data, status) {
console.log((data || 'Req Failed') + ': ' + status);
});
});
//]]></script>
</head>
<body>
<div ng-app="myApp" ng-controller="myController">
Location Header: {{loc}}
</div>
</body>
</html>
<?php
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
