Join the Stack Overflow Community
Stack Overflow is a community of 6.4 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up

I have an angularjs app to call a flickr api.

I want the data in RAW json format with no function wrapper and as per the docs, applying &nojsoncallback=1 .

However I'm getting the following console error. SyntaxError: Unexpected token '

This error only appears when applying &nojsoncallback=1 to the url. However I want RAW json with no wrapper.

If I don't apply the above to the url and simple use https://api.flickr.com/services/feeds/photos_public.gne?tags=trees&format=json I get no error, but when console logging out the typeof I get 'string' displayed.

I then try parsing this into JSON and get another error because it has a wrapped. Hence why I want RAW.

Below is the code I have so far. Any help - much appreciated.

JS

(function(){
'use strict';

    var app = angular.module('flickrApp', []);

    app.controller('FlickrFeedController', ['$http', '$scope', function($http, $scope){

        // grab the flickr api
        var response = $http.get('http://crossorigin.me/https://api.flickr.com/services/feeds/photos_public.gne?tags=trees&format=json&nojsoncallback=1');

        // on success
        response.success(function(data){

            // console logging out the typeof gives 'string'
            console.log(typeof(data));

            // since it's a string I would then want to convert it into a json object
            // but I need to sort the current error out first
            // data = JSON.parse(data);
            // console.log(typeof(data));

        });
    }]);

})();

EDIT: This is a work around removing &nojsoncallback=1 from the url (removing the console error) and since the data comes back as a string having to replace characters, then parse. Not great but I get the required output (object) and thought I'd add it up here for others to view.

JS

(function(){
'use strict';

    var app = angular.module('flickrApp', []);

    app.controller('FlickrFeedController', ['$http', '$scope', function($http, $scope){

        // grab the flickr api
        var response = $http.get('http://crossorigin.me/https://api.flickr.com/services/feeds/photos_public.gne?tags=trees&format=json');

        // on success
        response.success(function(data){

            // typeOf is 'string' even though format=json is specified in the url
            //console.log(typeof(data));
            //console.log(data);

            // work-around since data is returned as a string
            data = data.replace('jsonFlickrFeed(', '');
            data = data.replace('})', '}');
            data = data.replace(/\\'/g, "'");

            // parse the data
            data = JSON.parse(data);

            // typeOf is 'object'
            console.log(data.items);
            console.log(typeof(data));

        });
    }]);

})();
share|improve this question
up vote 0 down vote accepted

Generate angular resource to call the api with format: {'json', jsoncallback: 'JSON_CALLBACK'}. Check complete solution here - http://plnkr.co/edit/Lxxkb9?p=preview

var app = angular.module('flickrApp', ['ngResource']);

app.factory('Flickr', function($resource, $q) {
  var photosPublic = $resource('http://crossorigin.me/https://api.flickr.com/services/feeds/photos_public.gne?tags=trees&format=json', 
      { format: 'json', jsoncallback: 'JSON_CALLBACK' }, 
      { 'load': { 'method': 'JSONP' } });
  return {
    get: function() {
      var q = $q.defer();
      photosPublic.load(function(resp) {
        q.resolve(resp);
        console.log(resp.items);
      })
      return q.promise;
    }
  }
});
app.controller('FlickrCtrl', function($scope, Flickr) {
Flickr.get();
});
share|improve this answer
    
Updated the plunkr and removed the optional code. – jitendra singh Feb 28 at 17:32
    
Thanks - I'll mark this as the answer – fidev Feb 29 at 17:29

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.