Angular http.post header issue - angularjs

Question

How do I send CSRF and Token data in a http request?
I'm using Angular to post json data to a Drupal services endpoint but I'm experiencing problems.
// drupal post node
$scope.post_node = function(){
console.info('Node post ...');
var promise = $http.post('http://mysite/QuestionsGenerator/angularjs-headless/api/v1/node',
{
"title" : "Node Test",
"body" : "Node body contents test#2",
"type" : "page"
},
{
'Content-type' : 'application/json',
'Accept' : 'application/json',
'X-CSRF-Token' : $cookieStore.get('user_session_token'),
'Cookie' : $cookieStore.get('user_session_cookie')
}
)
.then(
// successCallback,
function(response){
console.log('Post-node working ...');
$log.info(response);
},
// errorCallback
function(response){
console.log('Post-node NOT working ...');
$log.error(response);
}
);
return promise;
}
}]);
Using the code above, I'm trying to post to a Drupal services endpoint for a node to be created - so I have to post a title, body and node type for the new node.
In addition, I have to post X-CSRF-Token and Cookie information which authenticates my Angular user with Drupal so the node can be successfully created.
However, I receive the following error: Refused to set unsafe header "Cookie" followed by a message which says the user is not logged in - I can confirm the user not only exist but is logged in.
My network tab shows no details of my token or cookie details begin sent - which would explain the user not begin authenticated.
How can I send my cookie and token data?
UPDATE
I tried adding the withcredentials line as in the code below:
var headlessQS = angular.module('headlessQS', ['ngRoute', 'ngCookies']);
headlessQS.config(function($routeProvider, $httpProvider){
$routeProvider
$httpProvider.defaults.withCredentials = true
.when('/', {
templateUrl: 'pages/main.html',
controller: 'mainController'
})
.when('/wiris', {
templateUrl: 'pages/wiris.html',
controller: 'wirisController'
})
.when('/signin', {
templateUrl: 'pages/signin.html',
controller: 'signinController'
})
});
// Controllers
......
But, I get the following error:
Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.0-rc.2/$injector/modulerr?p0=headlessQS&p1=…
Also, when the withcredentials code does work, do I add my token etc data like in the following code:
var promise = $http.post('http://mysite/QuestionsGenerator/angularjs-headless/api/v1/node',
{
"title" : "Node Test",
"body" : "Node body contents test#2",
"type" : "page"
},
{
headers: {
'Content-type' : 'application/json',
'Accept' : 'application/json',
'X-CSRF-Token' : $cookieStore.get('user_session_token'),
'Cookie' : $cookieStore.get('user_session_cookie')
}
}
)
.then(
// successCallback

Answer 1

If you're using $cookies, and you set:
$httpProvider.defaults.withCredentials = true; // from main module
then your cookies should be sent on every request.
By default, $http will also read a token from an XSRF-TOKEN cookie and apply an X-XSRF-TOKEN header to the request.
If you're trying to send a JWT token as a Bearer token on the Authorization header, look into using an HTTP Interceptor:
// register the interceptor as a service
$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
return {
'request': function(config) {
var access_token = tokenService.getAccessToken();
if (access_token) {
if (config.url.indexOf(this.myAPIUrl) === 0) {
config.headers.Authorization = 'Bearer ' + access_token;
}
}
return config;
}
};
});
$httpProvider.interceptors.push('myHttpInterceptor');
Note: You can also use the HTTP Interceptor to capture all HTTP responses, and errors on HTTP requests and responses.