Tumblr API Angular $http GET

Question

I'm running into an API issue with Tumblr and Angular that I can't quite figure out. When using $http to try to get information from a certain blog it keeps 'Response for preflight is invalid'. I think I'm going a bit cross-eyed looking at this code. Will someone look at this and tell me what I'm doing wrong? Thanks.

$scope.tumblrKey = 'mldv2B4xUD5roLX8XfbYdgJhzlgLxfm8mBRuKQhBxXsUFLiqEx';
$scope.tumblrUrl = 'http://api.tumblr.com/v2/blog/whileoutriding.tumblr.com/info?api_key=';

$http({
  method: 'GET',
  headers: {
    'Authorization': $scope.tumblrKey
  },
  url: $scope.tumblrUrl + $scope.tumblrKey
}).then(function successCallback(response) {

    console.log('it worked', response);

  }, function errorCallback(response) {

    console.log('it did not work', response);

});

Answer 1

You can change your $http request like so:

$http({
      method: 'jsonp',
      dataType: 'json',
      headers: {
        'Authorization': $scope.tumblrKey
      },
      params: {
        format: 'jsonp',
        callback: 'JSON_CALLBACK'
    },
      url: $scope.tumblrUrl + $scope.tumblrKey
    })

Here's a plunkr with working code

This seems to work fine. Good luck!