如何用angular.js解析JSONP$http.jsonp()响应?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (74)

我正在使用angular的$http.jsonp()请求,它成功地返回包装在函数中的json:

var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=jsonp_callback";

$http.jsonp(url).
    success(function(data, status, headers, config) {
        //what do I do here?
    }).
    error(function(data, status, headers, config) {
        $scope.error = true;
    });

如何访问/解析返回的函数包装的JSON?

提问于
用户回答回答于

现在必须像这样定义回调:

$http.jsonp('some/trusted/url', {jsonpCallbackParam: 'callback'})

更改/访问/声明参数通过$http.defaults.jsonpCallbackParam,默认为callback

注意:还必须确保您的URL已添加到受信任/白名单中:

$sceDelegateProvider.resourceUrlWhitelist

或通过以下方式显式信任:

$sce.trustAsResourceUrl(url)

success/error弃用

$http传统方法的承诺success,并error已被弃用,并将在V1.6.0被删除。改为使用标准然后方法。如果$httpProvider.useLegacyPromiseExtensions设置为false那么这些方法将抛出$http/legacy error

使用:

var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts"
var trustedUrl = $sce.trustAsResourceUrl(url);

$http.jsonp(trustedUrl, {jsonpCallbackParam: 'callback'})
    .then(function(data){
        console.log(data.found);
    });

Angular 1.5.x和之前的版本

你所需要做的就是改变callback=jsonp_callbackcallback=JSON_CALLBACK这样:

var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK";

然后.success,如果回报成功,你的功能应该像你一样开火。

这样做可以让你不必弄脏全局空间。这在这里的AngularJS文档中有记录。

fiddle使用此方法:http : //jsfiddle.net/subhaze/a4Rc2/114/

完整的例子:

var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK";

$http.jsonp(url)
    .success(function(data){
        console.log(data.found);
    });
用户回答回答于

最重要的事情我并没有很长一段时间明白的是,要求必须含有“回调= JSON_CALLBACK”,因为AngularJS 修改请求的URL,代替“JSON_CALLBACK”的唯一标识符。服务器响应必须使用“callback”参数的值而不是硬编码“JSON_CALLBACK”:

JSON_CALLBACK(json_response);  // wrong!

自从我编写自己的PHP服务器脚本以来,我以为我知道它需要的函数名称,并且不需要在请求中传递“callback = JSON_CALLBACK”。大错!

AngularJS用唯一的函数名称替换请求中的“JSON_CALLBACK”(如“callback = angular.callbacks._0”),服务器响应必须返回该值:

angular.callbacks._0(json_response);

扫码关注云+社区