I have been working on rewriting a functional $.ajax server call to utilize AngularJS $http.put. However, the $http method returns a 401 unauthorized error.
The original ajax call I am attempting to rewrite is structured like this:
$.ajax({
url: domain + "/api/v1/user/logout/",
timeout: 10000,
type: "POST",
contentType: "application/json",
beforeSend: function(xhr) {xhr.setRequestHeader("Authorization", api_user())},
success: function(data) {
if (data.success) {
notify("Thanks for signing out");
}
}
});
My AngularJS equivalent code looks like this:
logoutUser: function() {
var config = {headers: {
'Authorization': api_user()
}
};
return $http.post(apiDomain + '/api/v1/user/logout/', config).then(function(response) {
return response;
});
}
When I execute this code, the server responds with a 401 unauthorized error and the 'then' part of the $http.post function is not triggered.
EDIT: More details
Upon inspecting through Firebug, the request headers are as follows:
POST /api/v1/user/logout/ HTTP/1.1
Host: localhost:8000
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:40.0) Gecko/20100101 Firefox/40.0
Accept: application/json, text/plain, */*
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Content-Type: application/json;charset=utf-8
Referer: http://localhost:8100/
Content-Length: 40
Origin: http://localhost:8100
X-Forwarded-For: 12.13.14.15
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
The POST data retrieved from Firebug reads:
{"headers":{"Authorization":"ApiKey bill:bfab6e5a1fb6e4e405756dcf14a634e86ba05c7b"}}
This leads me to question whether the authorization is being sent as data rather than a header.