nodejsと角型アプリケーションの送信401 Unauthorized and 200 OK with JWT

Question

フォームの登録をクリックすると、ノードサーバーがJWTを認可する前に/ profile（保護されたルート）にURLを設定しているとわかります200 OKを送信します。私はこれを防ぐ方法がわかりません。

ローカルストレージにトークンがある場合でも、保護されたルートが返され、不正なエラーが発生します。 I /プロファイルルートをリロードする場合にそうであっても200 OK応答が送信される場合、それはまだ401

ルートを取得します：

const path = require('path'); 
const Company = require('./models/app'); 
const User = require('./models/users'); 
const jwt = require('express-jwt'); 
let auth = jwt({ 
    secret: process.env.CONFIG_SR, 
    requestProperty: 'payload' 
}); 

module.exports = function(app , passport) { 
    function profileCheck(req , res , next) { 
     if(!req.payload._id) { 
      res.status(401).json({ 
       "message" : "UnauthorizedError: private profile" 
      }); 
     } else { 
      User.findById(req.payload._id) 
       .exec(function(err, user) { 
        res.status(200).json(user); 
       }); 
     } 
    } 
    app.get('/' , function(req , res) { 
     res.sendFile(path.join(__dirname , '../public' , 'index.html')); 
    }); 
    app.get('/login' , function(req , res) { 
     res.sendFile(path.join(__dirname , '../public' , 'login.html')); 
    }); 
    app.post('/api/login' , function(req, res) { 
     passport.authenticate('local' , function(err, user, info) { 
      if(err) { 
       return res.json({ 
        'message': err 
       }); 
      } if(user) { 
       token = user.generateJwt(); 
       res.status(200); 
       res.json({ 
        "token" : token 
       }); 
      } else { 
       return res.json({ 
        'message': 'User not found' 
       }); 
      } 
     })(req, res); 
    }); 
    app.get('/register' , function(req , res) { 
     res.sendFile(path.join(__dirname , '../public' , 'register.html')); 
    }); 
    app.post('/api/register' , function(req, res) { 
     User.findOne({'local.email': req.body.email}, function(err, user) { 
      if(err) { 
       return res.json({ 
        'message': err 
       }); 
      } 
      if(user) { 
       return res.json({ 
        'message': 'User already exists' 
       }); 
      } else { 
       let newUser = new User(); 

       newUser.local.email = req.body.email; 
       newUser.local.name = req.body.name; 
       newUser.local.password = newUser.setPassword(req.body.password); 

       newUser.save(function(err) { 
        // passport.authenticate('local',{ session: false }, function(req, res) {}); 
        var token; 
        token = newUser.generateJwt(); 
        res.status(200); 
        res.json({ 
         'token': token 
        }); 
       }); 
      } 
     }); 
    }); 
    app.get('/profile', auth, profileCheck, function(req , res) { 
     res.render('profile.jade'); 
    }); 
    app.get('/logout' , function(req , res) { 
     req.logout(); 
     res.json({ 
      'message': 'Bye' 
     }); 
    }); 
} 

コントローラ

app.controller('authController', ['$scope', '$http', '$window', 'authenticationService', 'restrictData', function($scope, $http, $window, authenticationService, restrictData) { 
$scope.credentials = { 
    name : "", 
    email : "", 
    password : "" 
} 
$scope.user = {}; 
$scope.regSubmit = function() { 
    authenticationService.register($scope.credentials) 
     .error(function(err) { 
      console.log(err); 
     }).then(function() { 
      restrictData.getProfile() 
       .success(function(data) { 
        $scope.user = data; 
       }).error(function(e) { 
        console.log(e); 
       }); 
      var url = '/profile'; 
      $window.location.href = url; 
     }); 
} 
$scope.logSubmit = function() { 
    authenticationService.login($scope.credentials) 
     .error(function(err) { 
      console.log(err); 
     }).then(function() { 
      var url = '/profile'; 
      $window.location.href = url; 
     }); 
} 
$scope.isLoggedIn = authenticationService.isLoggedIn(); 
$scope.currentUser = authenticationService.currentUser(); 

}]）。

サービス1：

app.factory('authenticationService',['$http', '$window', '$timeout', '$q' , function($http, $window, $timeout, $q) { 
var saveToken = function(token){ 
    $window.localStorage['mean-token'] = token; 
} 
var getToken = function(){ 
    return $window.localStorage['mean-token']; 
} 
var logout = function(){ 
    $window.localStorage.removeItem('mean-token'); 
} 
var isLoggedIn = function() { 
    var token = getToken(); 
    var payload; 

    if(token) { 
     payload = token.split('.')[1]; 
     payload = $window.atob(payload); 
     payload = JSON.parse(payload); 

     return payload.exp > Date.now()/1000; 
    } else { 
     return false; 
    } 
} 
var currentUser = function() { 
    if(isLoggedIn()) { 
     var token = getToken(); 
     var payload = token.split('.')[1]; 
     payload = $window.atob(payload); 
     payload = JSON.parse(payload); 
     return { 
      email : payload.email, 
      name : payload.name 
     }; 
    } 
} 
register = function(user) { 
    return $http.post('/api/register', user).success(function(data){ 
    saveToken(data.token); 
    }); 
}; 

login = function(user) { 
    return $http.post('/api/login', user).success(function(data) { 
    saveToken(data.token); 
    }); 
}; 
return { 
    saveToken: saveToken, 
    getToken: getToken, 
    isLoggedIn: isLoggedIn, 
    currentUser: currentUser, 
    register: register, 
    login: login, 
    logout: logout 
}; 

}]）。

サービス2：

app.factory('restrictData', function($http, authenticationService) { 
var getProfile = function() { 
    return $http.get('/profile', { 
     headers: { 
      Authorization: 'Bearer ' + authenticationService.getToken() 
     } 
    }); 
} 
return { 
    getProfile: getProfile 
} 

}）。

Answer 1

私の研究で見つけたことから、JWTを使って非APIルートを保護することはお勧めできません。だから、私のアプリが機能するために、フロントエンドページのすべてのルーティングを角側にシフトしました。それは特に望んでいませんでしたが、この問題を解決し解決しました。私はすべて削除

は、このようなフロントエンドページにつながるれた要求を取得：

app.get('/' , function(req , res) { 
    res.sendFile(path.join(__dirname , '../public' , 'index.html')); 
}); 

をそれから私は、すべてのパスのルートにrouteProviderを（ので、これは動作しますあなたのページに角度-ルートが含まれていることを確認してください）使用しました：それからちょうど従って