Question

我有一个由我自己和它工作的AngularJs用户验证。一切都很好。我可以登录，可以检查用户是否可以访问特定页面等。除了令牌身份验证我只在第二次与WebApp进行交互时运行。

例如，如果我更改了localStorage上的某些数据（我正在保存用户数据）并尝试进入管理页面，例如，我将能够访问该页面，但是在下次交互时，然后我会从页面中被踢出并返回登录过程。

可能会发生什么？这是我正在使用的代码：

app.js

function getUser() {
    userinfo = JSON.parse(localStorageService.get("user")); //convert string to json
    $scope.userData = userinfo; //Display purpouso only;
};
function checkToken() {
    var userCheckToken = JSON.parse(localStorageService.get("user"));
    $http.post('dist/php/db.php?action=token', userCheckToken)
    .success(function(res){
        userToken = res;
    }).error(function(err){
        alert(feedbackError);
    });
};

$rootScope.$on('$stateChangeStart', function(e, to) {
    if (to.data && to.data.requireLogin) {
        getUser();
        checkToken();
        if (!userinfo) {
            e.preventDefault();
            $state.go('login');
            alert("You need to be loggedin");
        }
        else if (userinfo && !userToken) {
            e.preventDefault();
            userInfo = false;
            $state.go('login');
            localStorageService.clearAll();
            alert('Authentication failed');
        }
    }
});

个人function也会发生同样的事情。假设我在页面上有一个重要的功能，所以只有管理员才能执行该功能。我也在检查该进程的身份验证，但它只是在第二次交互时发生了同样的事情。

功能：

$scope.debugTk = function() {
    checkToken();
    if (!userToken) {
        alert('Authentication failed');
    } else {
        $http.get('dist/php/db.php?action=debugTk')
        .success(function(res){
            $scope.resultDebug = res;
        }).error(function(err){
            alert(feedbackError);
        });
    }
}

Answer 1

正如charlieftl所说，你的checkToken函数使用默认情况下异步的XHR请求。您需要使用这样的回调来包装依赖于blue.addEventListener(MouseEvent.MOUSE_DOWN, pickObject);执行的所有内容：

checkToken

您的function getUser() { userinfo = JSON.parse(localStorageService.get("user")); //convert string to json $scope.userData = userinfo; //Display purpouso only; }; function checkToken() { var userCheckToken = JSON.parse(localStorageService.get("user")); $http.post('dist/php/db.php?action=token', userCheckToken) .success(function(res){ return res; // returns inside a promise make them chainable. }).error(function(err){ return feedbackError; }); }; $rootScope.$on('$stateChangeStart', function(e, to) { if (to.data && to.data.requireLogin) { getUser(); if (!userinfo) { e.preventDefault(); $state.go('login'); alert("You need to be loggedin"); } else { checkToken().then(function(userToken){ // this gets executed after checkToken() succeeds. if (!userToken) { // this won't work here: e.preventDefault(); userInfo = false; $state.go('login'); localStorageService.clearAll(); alert('Authentication failed'); } }, function(err){ // this gets called when your .error method returns an error // eg. the HTTP request failed. }); } } });功能将如下所示： $ scope.debugTk = function（）{ checkToken（）。然后（函数（）{ //成功，function（）{ //错误

debugTk

在此处详细了解承诺：https://github.com/wbinnssmith/awesome-promises

编辑：if (!userToken) { alert('Authentication failed'); } else { $http.get('dist/php/db.php?action=debugTk') .success(function(res){ $scope.resultDebug = res; }).error(function(err){ alert(feedbackError); }); } }); }调用无法在承诺内部运行，您需要更改代码以适应承诺。我不会将这样的东西包装成$ stateChangeStart事件，而是使用服务来处理所有auth的东西。

Answer 2

根据AngularJS文件：

$ http遗留承诺方法成功与错误已被弃用。请改用标准方法。如果$ httpProvider.useLegacyPromiseExtensions设置为false，则这些方法将抛出$ http / legacy错误。

关于您的问题，因为有人说checkToken函数是异步的，所以每次调用此函数时都需要使用promises。从$http.post函数返回checkToken结果：

function checkToken() {
  var userCheckToken = JSON.parse(localStorageService.get("user"));
  return $http.post('dist/php/db.php?action=token', userCheckToken).then(
    function (res) {
      userToken = res;
    },
    function (err) {
      alert(feedbackError);
    });
};

然后将其用作常规承诺：

$scope.debugTk = function() {
  checkToken().then(function(){
    if (!userToken) {
      alert('Authentication failed');
    } else {
      //.....
    }
  });
}

AngularJs用户身份验证仅在第二次交互时发生

2 个答案: