angular.js - AngularJS 用 $http.jsonp 方法跨域请求数据错误的问题

Question

以前知道AngularJS是个什么东西，今天刚开始动手尝试，遇到了这个问题。

代码如下：

$http.jsonp("https://request.address.json?callback=JSON_CALLBACK")
    .success(
        function(data, status, header, config){
            $scope.list = data;
            alert(data);
        }
    )
    .error(
        function(data){
            alert("error");
        }
    );

访问后通过浏览器的开发者工具能看到返回的状态码是200，并且能看到返回的json字符串，但是执行后总是error方法被调用，找了很久也找不到解决办法，有么有高手能解答一下。

Answer 1

On the client side, the official documentation makes it very clear"Relative or absolute URL specifying the destination of the request. The name of the callback should be the string JSON_CALLBACK."On the server side, the callback parameter obtained is angular. angular.callbacks._0 and the like calculated by the client (angular will calculate and update the callback field value based on the number of requests from the client before sending). After the server receives the callback field, it will use the string 'angular. callbacks._0({json data})'Just return it, for example:

<?php
$callback = $_GET['callback'];
$response = array('code'=>200, 'data'=>'success');

$json = json_encode($response);
echo "$callback($json)";

Answer 2

Post the returned json and take a look

Answer 3

The backend interface needs to do special processing for jsonp requests. The request carries the callback parameter:

The return should be a piece of JavaScript code:

angular.callbacks._0({
    "longitude": 120.1614,
    "latitude": 30.2936,
    "asn": "AS4837",
    "offset": "8",
    "ip": "60.12.58.161",
    "area_code": "0",
    "continent_code": "AS",
    "dma_code": "0",
    "city": "Hangzhou",
    "timezone": "Asia\/Shanghai",
    "region": "Zhejiang",
    "country_code": "CN",
    "isp": "CNCGROUP China169 Backbone",
    "country": "China",
    "country_code3": "CHN",
    "region_code": "02"
});

This is related to the fact that JSONP can cross domains. JSONP uses script tags as the carrier of requests; while Ajax uses XHR objects.

Answer 4

Return content changed to:

JSON_CALLBACK({
    "longitude": 120.1614,
    "latitude": 30.2936,
    "asn": "AS4837",
    "offset": "8",
    "ip": "60.12.58.161",
    "area_code": "0",
    "continent_code": "AS",
    "dma_code": "0",
    "city": "Hangzhou",
    "timezone": "Asia\/Shanghai",
    "region": "Zhejiang",
    "country_code": "CN",
    "isp": "CNCGROUP China169 Backbone",
    "country": "China",
    "country_code3": "CHN",
    "region_code": "02"
})

Try it?

Answer 5

jsonp(url,[config]) can only process results in JSONP format (JSON != JSONP). If the data you return is in JSON format, jsonp() cannot parse it and will report an error.

Answer 6

The parameter is callback=JSON_CALLBACK, angular will automatically replace your JSON_CALLBACK and assign callbackName for you.
You can request data, but you cannot enter sccess because the callback set by angular for you is not triggered. I think this is a bit of a trap. It’s not as user-friendly as jQuery’s design

Answer 7

Has the original poster solved it? I also encountered the same problem as you. I can go to success normally on the browser, but when debugging on my mobile phone, I always get an error, data=undefined status: 404

Answer 8

Has the original poster solved it? I also encountered the same problem as you.
Console display: JSON_CALLBACK is not defined

$http.jsonp('http://m-static.igrow.cn/01tpl/json/data.json?callback=JSON_CALLBACK');
//If you add this, you can adjust the data, but it feels very strange.
window.JSON_CALLBACK = function(data) {

console.log(data);

};

What should I do if I need to perform other things when error is returned?