How to pass Authorization Token in Header Angular JS

Question

In my controller I am trying to call my API but I am unable to pass Autherization token.

I have created a config var and passing my token in it but getting following response:

900902Missing CredentialsRequired OAuth credentials not provided. Make sure your API invocation call has a header: "Authorization: Bearer ACCESS_TOKEN"

** JS Code **

 app.controller("AuthenticationController", function($scope, API_URL, vcRecaptchaService, $http) {

       var config = {
         headers: {
           'Authorization': 'Bearer 00000-e5673-346756f-8676-f7567561a'
         }
       };
       $scope.verifyRecaptcha = function() {

         if (vcRecaptchaService.getResponse() === "") {
           alert("User did not resolve the recaptcha")
         } else {
           var post_data = {
             'g-recaptcha-response': vcRecaptchaService.getResponse()
           }
           $http.post('https:1.1.1.1/abc/vdc/verify', config, post_data).success(function(response) {

               if (response.success === true) {
                 alert("Successfully resolved the recaptcha.");
               } else {
                 alert("User verification failed");
               }
             })
             .error(function(error) {
               alert("Error Occured while resolving recaptcha.");
               console.log(error);
             })
         }
       }

Answer 1

i think you've switched the position of the payload and the header

should be http.post(url, data, config) instead of http.post(url, config, data)

link to doc

I'd recommend to put all the logic inside an http interceptor, so the auth header will be appended to each request.