Javascript 平均堆栈登录错误：未提供令牌

背景：我正在创建一个应用程序，使用node/express作为后端，mongo作为数据库，angular作为前端。我正在使用jsonwebtoken对用户进行身份验证。一旦用户登录，本地存储器中就会存储一个令牌，用于对所有请求进行身份验证。用户登录后， 通过Auth.getUser（）检索名称和用户名，这是一种从后端获取数据的角度工厂方法。每个请求

问题：我无法让用户重定向到主页，因为以下代码未运行：

 vm.login = function() {      
        vm.error = '';

        Auth.login(vm.loginData.username, vm.loginData.password)
        .then(function(data) {
            Auth.getUser()
            .then(function(data) {
                vm.user = data.data;
            });

            if (data.success) {
                $location.path('/');
            } else {
                vm.error = data.message;
                console.log(vm.error);
            }

        });
    }

 api.use(function(req,res,next) {
        console.log('someone tried to access a secure page');

        var token = 
            req.body.token || req.param('token') || req.headers['x-access-token'];

        if (token) {
       //code 


      } else {
         res.status(403).send({ success: false, message: "No Token Provided"});

我没有被重定向到主页，尽管我也没有在开发人员控制台或我的终端中收到任何消息

当我通过dev控制台检查本地存储时，我没有令牌。但是，我能够使用POSTMAN成功登录/注册/发布数据。我认为可以通过以下步骤将问题具体化：

1。用户登录，令牌存储在本地存储器中 2.Auth.getUser（）假定从后端请求用户数据。 3。每个请求都需要通过jsonwebtoken.verify（）方法验证令牌。 4。由于某些原因，令牌未发送到我的后端，因此无法运行：

 vm.login = function() {      
        vm.error = '';

        Auth.login(vm.loginData.username, vm.loginData.password)
        .then(function(data) {
            Auth.getUser()
            .then(function(data) {
                vm.user = data.data;
            });

            if (data.success) {
                $location.path('/');
            } else {
                vm.error = data.message;
                console.log(vm.error);
            }

        });
    }

 api.use(function(req,res,next) {
        console.log('someone tried to access a secure page');

        var token = 
            req.body.token || req.param('token') || req.headers['x-access-token'];

        if (token) {
       //code 


      } else {
         res.status(403).send({ success: false, message: "No Token Provided"});

以下是我认为相关的文件：

后端：

var mongoose = require('mongoose');
var User = require('../models/user.js');
var Story = require('../models/story.js');
var config = require('../../config/config.js');
var jsonWebToken = require('jsonwebtoken');
var sessionSecret = config.sessionSecret;


function createToken(user) {

    var token = jsonWebToken.sign({
        id: user._id,
        name: user.name,
        username: user.username
    }, sessionSecret, {expiresInMinutes: 1440});

    return token;
}

module.exports = function(app, express) {
    var api = express.Router();


 api.post('/login', function(req,res) {

        User.findOne({username: req.body.username})
            .select('password').exec(function(err, user) {
                if (err) {
                    res.send(err);
                    return;
                } else {
                   if (!user) {
                       res.send('user does not exist!');
                   } else {
                       var isPasswordValid = user.comparePassword(req.body.password);
                       if (!isPasswordValid) {
                           res.send('wrong password!');
                       } else {

                           var token = createToken(user);
                           res.json(
                               {success:true, 
                                message:'successfully logged in!', 
                                token: token});
                       }
                   }
                }
            })
        });


  api.use(function(req,res,next) {
        console.log('someone tried to access a secure page');

        var token = 
            req.body.token || req.param('token') || req.headers['x-access-token'];

        if (token) {
           jsonWebToken.verify(token, sessionSecret, function(err, decoded) {

                if(err) {
                    res.status(403).send({ success: false, message: "Failed to authenticate user"});

                } else {

                    //
                    req.decoded = decoded;
                    next();
                }
            });
        } else {
                   **//*****the message sent to my frontend*********
            res.status(403).send({ success: false, message: "No Token Provided"});
        }

    });

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

    app.use('/api', api);
}

前端：

angular.module('MainController', [])

    .controller('mainController', ['$rootScope','$location','Auth', function($rootScope,$location, Auth) {

    var vm = this;

    vm.isLoggedIn = Auth.isLogged();

    $rootScope.$on('$routeChangeStart', function() {

        vm.isLoggedIn = Auth.isLogged();
            Auth.getUser().then(function(data) {
                vm.user = data.data;
            })                              
        })


    vm.login = function() {      
        vm.error = '';

        Auth.login(vm.loginData.username, vm.loginData.password)
        .then(function(data) {
            Auth.getUser()
            .then(function(data) {
                vm.user = data.data;
            });

            if (data.success) {
                $location.path('/');
            } else {
                vm.error = data.message;
                console.log(vm.error);
            }

        });
    }

角度工厂：从后端检索数据

var authService = angular.module('authService', []);

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


    var authFactory = {};

    authFactory.login = function(username,password) {

        return $http.post('/api/login', {
            username: username,
            password: password
        }).success(function(data) {
            AuthToken.setToken(data.token);
            return data;         
        })
    }


    authFactory.getUser = function() {

       if (AuthToken.getToken()) {
           return $http.get('/api/me');
       } else {
           return $q.reject({message: 'unable to get data'});
       }
    }


    return authFactory;

});

authService.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;   
});

authService.factory('AuthInterceptor', function($q, $location, AuthToken) {

var interceptorFactory = {};


interceptorFactory.request = function(config) {

    var token = AuthToken.getToken();

    if(token) {

        config.headers['x-access-token'] = token;
    }
    return config;


};

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

主控制器：

angular.module('MainController', [])

    .controller('mainController', ['$rootScope','$location','Auth', function($rootScope,$location, Auth) {

    var vm = this;

    vm.isLoggedIn = Auth.isLogged();

    $rootScope.$on('$routeChangeStart', function() {

        vm.isLoggedIn = Auth.isLogged();
            Auth.getUser().then(function(data) {
                vm.user = data.data;
            })                              
        })


    vm.login = function() {      
        vm.error = '';

        Auth.login(vm.loginData.username, vm.loginData.password)
        .then(function(data) {
            Auth.getUser()
            .then(function(data) {
                vm.user = data.data;
            });

            if (data.success) {
                $location.path('/');
            } else {
                vm.error = data.message;
                console.log(vm.error);
            }

        });
    }

index.html：

<!DOCTYPE html>

<html ng-app="myApp">
    <base href="/">
    <head>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">


        <script src="https://code.angularjs.org/1.4.0-rc.1/angular.min.js"></script>
        <script src="https://code.angularjs.org/1.4.0-rc.1/angular-route.min.js"></script>
          <!--angular services  -->
        <script src="app/auth/authService.js"></script>
         <!--angular controllers  -->
        <script src="app/controllers/mainController.js"></script>

        <script src="app/app.routes.js"></script>
        <script src="app/app.js"></script>
    </head>

    <body>
        <div class="container">
            <div ng-view></div>
        </div>



    </body>
</html>

<div class="container" ng-controller="mainController as login">

    <form method="post" ng-submit="login.login()">  
       username:  <input type="text" name="username" ng-model="login.loginData.username">
       password:  <input type="password" name="password" ng-model="login.loginData.password">
        <button type="submit" class="btn btn-success">submit</button>


    </form>
</div>

login.html：

<!DOCTYPE html>

<html ng-app="myApp">
    <base href="/">
    <head>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">


        <script src="https://code.angularjs.org/1.4.0-rc.1/angular.min.js"></script>
        <script src="https://code.angularjs.org/1.4.0-rc.1/angular-route.min.js"></script>
          <!--angular services  -->
        <script src="app/auth/authService.js"></script>
         <!--angular controllers  -->
        <script src="app/controllers/mainController.js"></script>

        <script src="app/app.routes.js"></script>
        <script src="app/app.js"></script>
    </head>

    <body>
        <div class="container">
            <div ng-view></div>
        </div>



    </body>
</html>

<div class="container" ng-controller="mainController as login">

    <form method="post" ng-submit="login.login()">  
       username:  <input type="text" name="username" ng-model="login.loginData.username">
       password:  <input type="password" name="password" ng-model="login.loginData.password">
        <button type="submit" class="btn btn-success">submit</button>


    </form>
</div>

用户名：
密码：
提交

---

如有要求，将提供更多代码。我将非常感谢任何帮助，因为我花了无数个小时试图解决这个问题

我猜重定向是在获取数据之前发生的：

vm.login = function() {      
    vm.error = '';

    Auth.login(vm.loginData.username, vm.loginData.password)
    .then(function(resp) {  // <------changed the arg to 'resp'
        Auth.getUser()
        .then(function(data) {
            vm.user = data.data;
            if (resp.success) { // <------put the condition here with 'resp'
                $location.path('/');
            } else {
                vm.error = resp.message;
                console.log(vm.error);
            }
        });
    });
}

---

而

$http.get（'/api/me'）

，您没有发送任何

令牌

您可以在每个

http请求中发送令牌

我以为我是通过config.headers['x-access-token']=token发送令牌。如果您有不同的方式，请详细说明如何发送代币。您可以使用开发者工具->网络选项卡找到它。您在哪里设置令牌？你为此写了

interceptor

？这可能会有帮助：我忘了包括我的拦截器！请再次查看angularFactory代码，它位于底部。@Frosty619能否确认您能够将这些

vm.loginda.username、vm.loginda.password

传递给函数。如果查看angularFactory部分下的authFactory.login方法，您将看到如果登录成功，它将返回数据，然后我使用AuthToken.setToken（data.token）将令牌设置到本地存储中。由于我在本地存储中获取令牌，我想可以安全地假设我能够将登录参数传递给函数这是一个猜测，但我觉得您必须返回

interceptorFactory

。您是对的，我试过了，但仍然得到相同的错误。您可以尝试更改工厂的顺序吗？将

AuthToken

置于

Auth