角度 jsonp 返回状态码 0 而不是 401答案

【问题标题】：angular jsonp return status code 0 instead of 401角度 jsonp 返回状态码 0 而不是 401
【发布时间】：2013-09-18 02:55:49
【问题描述】：

我有一个 Angular 应用程序，它调用一个安全端点，并在访问时返回 401。我在我的应用程序中定义了一个拦截器，以便捕获错误，并在 401 时应用程序应重定向到登录页面。这一切听起来很简单，但是当我在浏览器中运行它时，我的错误响应中会出现状态代码 0。但是在我的 Chrome 控制台中，我可以看到一个日志，上面写着请求的 url 导致了 401。

我需要添加 JS 文件托管在 localhost:9000 上，并且提供 401 响应的应用程序位于 localhost:8080 上。怎么了？

    angular.module('ndbAdminUIApp', ['ngResource']).config(['$routeProvider', '$locationProvider', '$httpProvider', function ($routeProvider, $locationProvider, $httpProvider) {
        $routeProvider.when('/', {
            templateUrl : 'views/main.html',
            controller : 'MainCtrl'
        }).when('/login', {
            templateUrl : 'views/login.html',
            controller : 'LoginCtrl'
        }).otherwise({
            redirectTo : '/'
        });

        var interceptor = ['$location', '$q', function ($location, $q) {
            function success(response) {
                return response;
              }

            function error(response) {
                if (response.status === 401) {
                  $location.path('#login');
                  return $q.reject(response);
                }
                else {
                  return $q.reject(response);
                }
              }

            return function (promise) {
                return promise.then(success, error);
              };
          }];

      $httpProvider.responseInterceptors.push(interceptor);
    }])


    angular.module('ndbAdminUIApp').factory('ndbSystemService', function($http) {
        return {
            heartBeat: function() {
                $http.jsonp('http://localhost\:8080/ndb-service/r/system/hb?callback=JSON_CALLBACK');
              },
          };
      });

【问题讨论】：

标签： angularjs

【解决方案1】：

事实证明，Angular 在使用 JSONP 时无法真正计算出响应代码，这不是 Angular 的错，因为它得到的只是一个函数调用。因此，对于这样做的人来说，唯一的选择是将网页和其余服务放在同一主机上。

【讨论】：

实际上，我在不同的域上使用 django 和 angular 编写了一个企业应用程序，并使用 http-auth-interceptor 进行登录检查。它完美地工作。所以肯定是可以做到的。
这很有趣，但要明确一点，你是在做 jsonp 吗？如果你正在做 post，get 和类似的事情，就不会有问题，这一切都很好。问题是当您使用 jsonp 进行调用时。
@Farzad 您能否详细说明使这成为不可能的机制？我从来没有在我的代码中明确使用过任何 JSONP，那么为什么会出现这种情况呢？其实我只是查了一下JSONP是什么。
@StephaneEybert 如果您要使用来自不同于托管应用程序的域的数据，则需要使用 jsonp。至于为什么这不适用于 Angular，细节现在对我来说非常生疏。这可能是一个现在已修复的角度问题。
@Farzad 我也有同样的问题。我的网页托管在与 API 不同的主机上。我不使用 JSONP。相反，我在 Web 服务器上启用了 CORS，但我仍然得到零状态，尽管在 Fiddler 中很明显正在返回 401。

【解决方案2】：

您的服务器响应应该类似于 angular.callbacks._0({jsonResponseData}) 。在您的服务器代码中，您将创建一个响应（基本上是字符串的串联）作为响应，而不是发送 jsonResponseData。服务器代码大概是这样的：

var stringForResponse = new StringBuilder();
                stringForResponse.Append(callbackFunctionName);
                stringForResponse.Append("(");
                stringForResponse.Append(jsonResponseData);
                stringForResponse.Append(")");
                toString = stringForResponse.ToString();

【讨论】：