When setting http authorization headers the AngularJS app crashes

Question

I want to make a request to the twitter api and get the current logged in userfeed.

I tryed the twitter api with "apigee" and everything works fine. Even when copying the Authorization header from "apigee" into "postman" I get back data.

Well but when I try to make the http-request in my angular-app, the whole app stops working. In the browser there ist just the output "{{message}}" and the console prints two error messages:

Uncaught SyntaxError: Unexpected identifier :3000/javascripts/app.js:211
Uncaught Error: No module: app angular.min.js:17

The code in my app looks like this

app.controller('TwitterCtrl', function($scope, $http) {
var url = "https://api.twitter.com/1.1/statuses/home_timeline.json";
$http.get(url, 
{headers: {
  'Authorization':
  Oauth oauth_consumer_key = "xxxx",
  oauth_signature_method="HMAC-SHA1"
  oauth_timestamp="1401883718",
  oauth_nonce="840988792",
  oauth_version="1.0",
  oauth_token="xxxx",
  oauth_signature="xxx"
}})
.then(function (data) {
$scope.data = data.data;
console.log(data);
});

Can anyone help me or tell me what I'm doing wrong. Kevin

It's probably because of the invalid javascript. Encapsulate your Authorization value in a string. — Patrick Lorio, Jun 04 '14 at 14:12
I tried probably every possible way related to quotes like removing qutoes, replacing with singlequotes, wrapping in double/singlequotes but nothing works. — kevj, Jun 04 '14 at 14:28
a javascript string can only be on one line. A nice counter to this it to use `['something', 'something else'].join('')`. — Patrick Lorio, Jun 04 '14 at 14:54

score 1 · Accepted Answer · answered Jun 04 '14 at 14:34

try this way:

app.controller('TwitterCtrl', function($scope, $http) {
var url = "https://api.twitter.com/1.1/statuses/home_timeline.json";
$http.get(url, {
    headers: {
        'Authorization':
            'Oauth oauth_consumer_key = "xxxx",' +
            'oauth_signature_method="HMAC-SHA1",' +
            'oauth_timestamp="1401883718",' +
            'oauth_nonce="840988792",' +
            'oauth_version="1.0",' +
            'oauth_token="xxxx",' +
            'oauth_signature="xxx"'
    }
}).then(function (data) {
    $scope.data = data.data;
    console.log(data);
});

This way it works perfectly fine. Thanks. Now I'm getting a 400 bad request error but there is probably just something wrong with the parameters. — kevj, Jun 04 '14 at 14:57

When setting http authorization headers the AngularJS app crashes

1 Answers1