Как перенаправить пользователя в angular.js с помощью механизма токена доступа?

Question

Это поток процесс:

1. На переднем конце, пользователь входит в систему, обеспечивая имя пользователя и пароль.

2. Сервер ответит токен пользователю, если учетные данные верны.

3. Теперь пользователь должен быть перенаправлен на домашнюю страницу (ПРОБЛЕМА ЗДЕСЬ). Я установил токен в заголовке с помощью этого кода: $ http.defaults.headers.common ['X-Auth-Token'] = токен;

4. Кроме того, когда я делаю метод http.get, я получаю "OK" ответ

   $http({ method: 'GET', 
   
       url: '/home/', 
   
       headers: { 
        'X-Auth-Token': token 
       } 
   }).then(function successCallback(response) { 
       console.log(response.statusText); 
   } 
   

Теперь проблема в том, что когда я использую $ window.location.href = «/ home», сервер отвечает «неавторизованный токен», потому что сервер всегда ожидает маркер в заголовке с каждым запросом. В команде window.location.href я не могу установить заголовок.

Что является альтернативой перенаправлению пользователя на домашнюю страницу. Предположим, сервер всегда проверяет заголовок для токена доступа.

Заранее благодарен!

Answer 1

AFAIK, если вы используете HTTP-перенаправление, например, настройку window.location.href, нет возможности настраивать заголовки. Вы также можете сделать это при использовании сообщения формы. Используйте вместо этого файлы cookie для этой цели.

Возможно, Ajax (XMLhttpRequest) поддерживает установку настраиваемых заголовков.

Если и не против использования угловой маршрутизации (однако делать это может привести некоторую логику в JS код, который должен подвергаться только проверку подлинности пользователя), у может добавить resolve для resolveRedirectTo, в котором сделать Ajax запрос, чтобы проверить статус аутентификации при каждом изменении маршрута.

EDIT

---

Для использования угловой маршрутизации, основное мышление спросить пользователя сделать запрос отправить AJAX с помощью пользовательских заголовков на сервер, чтобы проверить, если он/она имеет право посетить эту страницу. Проверьте следующий код и this fiddle

app 
.config(['$routeProvider',function ($routeProvider) { 

    $routeProvider. 
    when('/home', { 
     templateUrl:"home.html" , 
     controller: 'MainController', 
     resolve:{ 
      isLogin:function($q, $http,$location) { 
       var deferred = $q.defer(); 
       //verify the user via an ajax request every time the user attempts to visit `/home` 
       //here since u have already set the custom headers for $http upon signing in, the next request will be with the header. 
       //the follow test url will return {isLogin:true} 
       $http({method: 'GET', url: 'http://echo.jsontest.com/isLogin/true'}) 
        .success(function(data) { 


         if(data.isLogin){ 
         deferred.resolve(data.isLogin); // no need to redirect 
         } 
         else{ 
         $location.path("/guest");// redirect to guest page if not authorized 
         deferred.reject(); 
         } 
        }) 
        .error(function(data){ 
        //error 
         $location.path("/guest"); 
         deferred.reject(); 
        }); 

       return deferred.promise; 
      } 
     } 
    }). 
    when("/guest",{ 
     templateUrl: "guest.html", 
     controller: 'GuestController', 
    }) 
    .otherwise({redirectTo:'/guest'}) 
}]);