最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - angular $resource with jsonp not working - Stack Overflow

programmeradmin1浏览0评论

I'm having troubles w/ the following code:

angular.module('offerServices', ['ngResource'])
    .factory('Offer', function ($resource) {

        return $resource('url/offers', { callback: 'JSON_CALLBACK' },
            {
                query: { method: 'JSONP' }
            }
        );                   

    })
    .factory('Trustyou', function ($resource) {
            return $resource('/:id/seal.json', {},
                {
                    query: { method: 'JSONP' }
                }
            );
    });

calling Offer.query({}, function(){}); in my controller works without any problems. but this part is not working:

       var trustYouData = Trustyou.query({ id: 'd8421e79-99f0-41b2-8d6e-9cfd62a9776b' }, function (data) {
            console.log(data);
        });

this always returns a 400 error:

"NetworkError: 400 Bad Request - .json?callback=angular.callbacks._1"

when I change my code and use jQuerys.getJSON, I don't have any issues:

 $.getJSON(".json?callback=?", function (data) {
            console.log(data);                           
        });

Why is the jQuery method working but angulars $resource implementation returns an error in this case?

I'm having troubles w/ the following code:

angular.module('offerServices', ['ngResource'])
    .factory('Offer', function ($resource) {

        return $resource('url/offers', { callback: 'JSON_CALLBACK' },
            {
                query: { method: 'JSONP' }
            }
        );                   

    })
    .factory('Trustyou', function ($resource) {
            return $resource('https://api.trustyou./hotels/:id/seal.json', {},
                {
                    query: { method: 'JSONP' }
                }
            );
    });

calling Offer.query({}, function(){}); in my controller works without any problems. but this part is not working:

       var trustYouData = Trustyou.query({ id: 'd8421e79-99f0-41b2-8d6e-9cfd62a9776b' }, function (data) {
            console.log(data);
        });

this always returns a 400 error:

"NetworkError: 400 Bad Request - https://api.trustyou./hotels/d8421e79-99f0-41b2-8d6e-9cfd62a9776b/seal.json?callback=angular.callbacks._1"

when I change my code and use jQuerys.getJSON, I don't have any issues:

 $.getJSON("https://api.trustyou./hotels/d8421e79-99f0-41b2-8d6e-9cfd62a9776b/seal.json?callback=?", function (data) {
            console.log(data);                           
        });

Why is the jQuery method working but angulars $resource implementation returns an error in this case?

Share Improve this question edited Nov 7, 2012 at 10:01 Viral Shah 2,2465 gold badges22 silver badges36 bronze badges asked Nov 7, 2012 at 9:58 mawomawo 2191 gold badge4 silver badges11 bronze badges 2
  • Have you tried GET instead of JSONP? Also, at the time you posted the question, was the format the same as the current response of the URL? – Aziz Alfoudari Commented Nov 8, 2012 at 22:36
  • yeah I've tried $http.get as well, and the format was the same ... – mawo Commented Nov 9, 2012 at 8:55
Add a ment  | 

2 Answers 2

Reset to default 4

There's some issue with the callback function on angular, i've open an issue in git

https://github./angular/angular.js/issues/1551

The callback name must be "JSONP_CALLBACK" in which angular will turn the callback name to callback=angular.callbacks._1

There's some web web service which cannot accept "angular.callbacks._1 "callback name.

solution :

var stock_hack

function stock_search(data) {
    stock_hack = data;
 }


var stock_hack

function stock_search(data) {
    stock_hack = data;
}


function jsonp_example($scope, $http) {

    $scope.doRequest = function() {
        $http({
            method: "JSONP",
            params: {
                input: "GM",
                callback: "stock_search"
            },
            url: "http://dev.markitondemand./Api/Lookup/jsonp",
            isArray: true
        }).success(function(data, status) {
/*
                 *Never Goes HERE !!
                 */


        }).error(function(data, status) {

/*
                 * FREAKING HACK !!!!
                 */
            console.info("goes here")
            console.info(stock_hack)

        });
    };


}​

My fiddle http://jsfiddle/pMGgR/

The point is you must call another javascript function to get your json respone.

Hope this help

I thought I would add a real solution to this problem. This is a working solution.

Here is the code

var symbol = 'NFLX';
var url = "http://dev.markitondemand./Api/v2/Lookup/jsonp?input="+ symbol +"&callback=JSON_CALLBACK";

$http.jsonp(url)
.success(function(data){
   console.info(data);
}).error(function(data, status) {
   console.info(data);
});

Returns

//[{"Symbol":"NFLX","Name":"Netflix Inc","Exchange":"NASDAQ"}]

Click here to go to the direct link

发布评论

评论列表(0)

  1. 暂无评论