【问题标题】：Why is $httpProvider.interceptors returning an `undefined` value为什么 $httpProvider.interceptors 返回“未定义”值
【发布时间】：2015-10-13 07:27:14
【问题描述】：

我创建了一个基本的 AngularJS 应用程序，它使用 Yelp 的 API，但在使用 $httpProvider.interceptors 解析我的回复时遇到了问题。

这是我的应用程序：

var app = angular.module("restaurantList", []);

我的yelpAPI 服务（未显示）验证我的 API 请求并生成 HTTP 请求。然后我将收到的数据输出到 Web 控制台，如下所示：

app.controller("mainCtrl", ["$scope", "yelpAPI", function ($scope, yelpAPI) {
    $scope.restaurants = [];
    yelpAPI.get(function (data) {
        $scope.restaurant = data;

        console.log($scope.restaurant);

    });

}]);

这是我请求的数据：

Object {region: Object, total: 37, businesses: Array[20]}

我希望数组位于 businesses 属性中。所以，我认为最好使用$httpProvider.interceptors 来解析Object.businesses 数组中找到的对象。

这是$httpProvider.interceptors 在我提出初始请求时的样子：

app.config(function ($httpProvider) {
    $httpProvider.interceptors.push(function () {
        return {
            response: function (response) {

                return response;
            }
        }
    });
});

这是$httpProvider.interceptors 现在的样子：

app.config(function($httpProvider) {
    $httpProvider.interceptors.push(function() {
        return {
            response: function(response) {

                var old_response = response.businesses,
                    new_response = [];


                for (var i = 0; i < old_response.length; i++) {

                    var obj = old_response[i],

                        new_obj = {
                            restaurant_name: obj.name,
                            phone_number: obj.display_phone,
                            yelp_rating: obj.rating,
                            reservation_url: obj.reservation_url
                        };

                    new_response.push(new_obj);
                }

                return new_response;
            }
        }
    });
});

现在，我收到一条错误消息，显示为 TypeError: Cannot read property 'businesses' of undefined。有什么我忽略的吗？

编辑 #1

我在拦截器中使用console.log(response) 打印我的响应，发现response.businesses 实际上应该是response.data.businesses。这解决了我的错误，但现在我的$http 调用返回undefined。知道我的新问题是什么吗？

编辑#2

app.factory("yelpAPI", function($http, nounce) {
    return {
        get: function(callback) {
            var method = "GET",
                url = "http://api.yelp.com/v2/search";
            var params = {
                callback: "angular.callbacks._0",
                oauth_consumer_key: "my_oauth_consumer_key",
                oauth_token: "my_oauth_token",
                oauth_signature_method: "HMAC-SHA1",
                oauth_timestamp: new Date().getTime(),
                oauth_nonce: nounce.generate(),
                term: "American",
                sort: 2,
                limit: 20,
                radius_filter: 4000,
                deals_filter: true,
                actionlinks: true
            };
            var consumerSecret = "my_consumer_secret",
                tokenSecret = "my_token_secret",
                signature = oauthSignature.generate(method, url, params, consumerSecret, tokenSecret, {
                    encodeSignature: false
                });
            params["oauth_signature"] = signature;
            $http.jsonp(url, {
                params: params
            }).success(callback);
        }
    }
});

【问题讨论】：

标签： javascript angularjs api angular-http angular-http-interceptors

【解决方案1】：

返回带有 {data : }: 的角度等待对象：

app.config(function($httpProvider) {
    $httpProvider.interceptors.push(function() {
        return {
            response: function(res) {

                var old_response = res.businesses,
                    new_response = [];


                for (var i = 0; i < old_response.length; i++) {

                    var obj = old_response[i],

                        new_obj = {
                            restaurant_name: obj.name,
                            phone_number: obj.display_phone,
                            yelp_rating: obj.rating,
                            reservation_url: obj.reservation_url
                        };

                    new_response.push(new_obj);
                }

                return {data : new_response};
            }
        }
    });
});

返回为 {data : new_response}

【讨论】：

使用 console.log(res) 打印拦截器中的响应
刚刚将res 打印到控制台，但遇到了另一个问题。更新了我的问题以反映新问题。
new_response 未定义？我们的 yelpAPI 回归？编辑您的问题和 yelpAPI 的邮政编码
是的，new_response 是 undefined。我添加了yelpAPI，但我不确定它是否有任何帮助。我们知道 yelpAPI 有效，因为 yelpAPI.get 不会调用 console.log。
返回为：return {data : new_response};

【解决方案2】：

Emir 帮助我解决了这个问题，但本质上，每当您使用 $httpProvider.interceptors 时，您都必须更新 response.data 并返回整个响应对象（即不仅仅是一个新数组，就像我所做的那样），因为 $http 选择了 @ 987654324@你的财产。

【讨论】：