x-access-token 未在 angular.js 中拦截

Question

当我使用名为 POSTMAN 的 chrome 分机呼叫 api

api.get('/me', function(req, res) {
    res.json(req.decoded);
});

return api;

使用 x-access-token 作为具有有效令牌值的 header，我得到了有效的响应。

当我使用从在线教程复制的拦截器时，我收到此错误消息：

http://localhost:3000/api/me 403 (Forbidden)

我的API

module.exports = function(app, express) {
api.use(function(req, res, next) {
    var token = req.body.token || req.param('token') || req.headers['x-access-token'];

    if (token) {
        jsonwebtoken.verify(token, secretKey, function(err, decoded) {
            if (err) {
                res.status(403).send({ sucess: false, message: "Failed to authenticate"});
            } else {
                req.decoded = decoded;
                next();
            }
        });
    } else {
        res.status(403).send({ success: false, message: "No Token Provided"});
    }
});

api.get('/me', function(req, res) {
        res.json(req.decoded);
    });

    return api; 
}

我的身份验证服务

.factory('Auth', function($http, $q, AuthToken) {

    var authFactory = {};
    authFactory.getUser = function() {
        if(AuthToken.getToken())

         ///Here it breaks here

            return $http.get('/api/me');
        else
            return $q.reject({ message: "User has no fucking token"});
    }
    return authFactory;
})
.factory('AuthToken', function($window) {
var authTokenFactory = {};

authTokenFactory.getToken = function() {
    return $window.localStorage.getItem('token');
}

authTokenFactory.setToken = function(token) {
    if (token)
        $window.localStorage.setItem('token', token);
    else
        $window.localStorage.removeItem('token');
}

return authTokenFactory;

})
.factory('AuthInterceptor', function($q, $location, AuthToken) {
var interceptorFactory = {};

 interceptorFactory.request = function(config) {
    var token = AuthToken.getToken();

    if(token) {
        config.header['x-access-token'] = token;
    }

    return config;
 };

 interceptorFactory.responeError = function(response) {
    if (response.status == 403)
        $location.path('/login');
    return $q.reject(response);
 }
 return interceptorFactory; })



.factory('Auth', function($http, $q, AuthToken) {

var authFactory = {};

authFactory.getUser = function() {
    if(AuthToken.getToken())
        return $http.get('/api/me');
    else
        return $q.reject({ message: "User has no fucking token"});
}
return authFactory; })

Answer 1

您必须通过将拦截器添加到 $httpProvider 来确保拦截器有效。以下代码在应用程序的配置内部执行此操作：

.config(function ($httpProvider) {
  $httpProvider.interceptors.push('AuthInterceptor');
});

请注意，您有一个拼写错误：

interceptorFactory.responeError -> interceptorFactory.responseError

编辑：

此外，当您希望多个请求具有相同的行为而不必更改每个请求时，使用拦截器会有所帮助。对于这个用例，也许不使用拦截器更简单，而是为一个请求手动添加 header：

return $http.get('/api/me', { headers: {'x-access-token': AuthToken.getToken()} });

x-access-token 未在 angular.js 中拦截

x-access-token not intercepting in angular.js

angularjs

interceptor

postman