2016-05-12 12 views
0

Ich arbeite mit eckigen js und Node Express mit JWT als Authentifizierungsmechanismus. Ich benutze http Post in eckig als nach meinem Benutzernamen und Passwort und es generiert erfolgreich das JWT-Token. Es ist jedoch nicht möglich, eine andere Seite umzuleiten. Wie kann ich dieses Token als Header in anderen Seiten durch angular JS festlegen.Angular JS senden gemeinsame Header mit http Post Redirect

Mein Winkelregler ist,

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

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

     $scope.login = function() { 
      option={'name':$scope.name,'password':$scope.password} 
      $http({ 
      method : "POST", 
      url : "/api/authenticate", 
      data:option 
      }).then(function mySucces(response) { 
      $scope.message = response.data; 
      //$scope.getData(response.data); 
      $http.defaults.headers.common['x-access-token'] = response.data; 
      window.location.href = '/api/home'; 
      alert("You are logged in.!"); 
      }, function myError(response) { 
      $scope.message = response.statusText; 
      //console.log(response.data); 
      console.log(response.statusText); 
      var alertPopup = $ionicPopup.alert({ 
       title: 'Login failed!', 
       template: 'Please check your credentials!' 
      }); 
      }); 
      } 

    }); 

HTML Skript ist,

<body ng-controller="AuthenticateCtrl"> 
    <div class="container"> 
    <h2>.</h2> 
    <input type="text" name="name" ng-model="name" placeholder="Name" required="" autofocus="" class="form-control" /></p> 
    <input type="password" name="password" ng-model="password" placeholder="Password" required="" class="form-control" /></p> 
    <button ng-click="login()" class="btn btn-lg btn-primary btn-block">Login</button> 
    <hr /> 
    {{ message }} 
</div> 
    </body> 

und die POST-Anfrage Teilehandling Knoten js ist,

apps.get('/home', function(req, res, next) { 
    res.sendFile(dirname+'/public/home.html'); 
    }); 

Aber die umgeleitet zu Hause Seite zeigt

Nachricht. Was ist meine Authentifizierungsfehlermeldung? Bitte helfen Sie mir, das zu lösen.

Antwort

0

Sie sollten an interceptor verwenden, um die x-access-token einzustellen, und Sie sollten routing verwenden, um zu navigieren. Sie sollten window.location.href nicht verwenden, um in einem Angular SPA zu navigieren.

Eine Probe Abfangjäger sieht wie folgt aus:

app.config(['$routeProvider', 
    function($routeProvider) { 
    $routeProvider. 
     when('/home', { 
     templateUrl: 'templates/home.html', 
     controller: 'HomeController' 
     }). 
     when('/login', { 
     templateUrl: 'templates/login.html', 
     controller: 'LoginController' 
     }). 
     otherwise({ 
     redirectTo: '/login' 
     }); 
    }]); 
+0

Wie Abfangjäger und Routing arbeiten in Winkel:

app.factory('sampleInterceptor', ['$location', function ($location) { var sampleInterceptorFactory = {}; var _request = function (config) { config.headers = config.headers || {}; config.headers['x-access-token'] = authData; return config; } sampleInterceptorFactory.request = _request; return sampleInterceptorFactory; }]); 

Eine Probe Router wie folgt aussieht. Würden Sie bitte ein Beispiel vorschlagen? – jicks

+0

Ja, ich habe meine Antwort bearbeitet, um Beispiele für beide hinzuzufügen. – Venkat

+0

Wenn ich einen Router umleite, gibt es ein # vor der URL. – jicks