Question

我创建了一个HTTP响应拦截器，用于检查401状态代码。如果代码是401，那么它应该只是在浏览器控制台中编写，但这不起作用。它似乎甚至无法捕捉到它。

App.js：

   'use strict';

// Declare app level module which depends on views, and components
var app = angular.module('myApp', []);




app.factory('authHttpResponseInterceptor', ['$q', '$location', function ($q, $location) {
        return {
            response: function (response) {
                if (response.status === 401) {
                    console.log("Response 401");
                }
                else
                {
                    console.log("other response but no 401");
                }
                return response || $q.when(response);
            },
            responseError: function (rejection) {
                if (rejection.status === 401) {
                    console.log("Response Error 401", rejection);
                }
                return $q.reject(rejection);
            }
        }
    }])
        .config(['$httpProvider', function ($httpProvider) {
                //Http Intercpetor to check auth failures for xhr requests
                $httpProvider.interceptors.push('authHttpResponseInterceptor');
            }]);

的index.html

<html lang="en" ng-app="myApp">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>My AngularJS App</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">

</head>
<body>

  <div ng-controller="testCtrl"></div>

  <script src="bower_components/angular/angular.js"></script>
  <script src="app.js"></script>
  <script src="testController.js" type="text/javascript"></script>

</body>
</html>

testController.js

app.controller('testCtrl', function ($scope, $http, $timeout) {


    $http.get('http://ec2-54-229-72-240.eu-west-1.compute.amazonaws.com:8080/webservice/api/stuffs/onestuff', {
        headers: {'Authorization': 'Bearer ' + localStorage.getItem('access_token')}
    }).success(function (data) {
        alert(data.id);
    });

});

访问令牌存储在先前登陆/登录页面的本地存储中。我想要达到的目的是将用户重新定向到此着陆页，如果他的令牌不再有效，或者他没有。或者

使用有效的令牌，没问题，我成功从api中检索数据。但是当我手动更改存储的令牌时，为了触发401，浏览器控制台中没有任何内容。

我确定它是401 Unauthorized Reponse，因为我在Chrome网络观察员中检查了它。这是我唯一获得的东西：

XMLHttpRequest cannot load http://ec2-54-229-72-240.eu-west-1.compute.amazonaws.com:8080/webservice/api/students/chat. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8383' is therefore not allowed access. The response had HTTP status code 401.

以下是请求（是的，因为有时我在列表中只有一个请求，当我刷新页面时，有时会附加其中有两个请求）

Name    Status     Type     Initiator
stuff    200       xhr       angular.js:10765
stuff    401       xhr       Other

这就是我在谈论的内容，这次，当我刷新页面时，我完成了两个请求，但这很奇怪，因为我只在我的代码中执行了一个请求。

有时，经过几次刷新我只有：

Name    Status     Type     Initiator
stuff    401       xhr       Other

但在这两种情况下，我从未在控制台中写过任何内容，这证明我已经发现401错误。

谢谢你，抱歉英语不好！

Answer 1

尝试添加request和requestError函数（以防万一，我知道它是可选的）：

request: function(config) {
        return config;
      },
requestError: function(err) {
        $q.reject(err);
      },

http://jsfiddle.net/tjruzpmb/218/

我更改了网址，但确实有效。还请注意我的评论。错误401永远不会在response（）中被捕获，因为拦截器总是将401重定向到responseError（）。

Answer 2

尝试使用$ log.log替换console.log。您需要将它添加到依赖项中，就像$ q和$ location一样。

作为一个例子：

    public static byte[] readBinaryFileFromAssets(File file){
    try{    
    byte[] data = null;

        DataInputStream dis = new DataInputStream(new FileInputStream(file));
        dis.readFully(data);
        dis.close();

        return data;
    }catch(FileNotFoundException e){
    //TODO something appropriate when the file isn't found
    }
return null;
    }

无法使用Angular HttpInterceptor

2 个答案: