Проверка статуса аутентификации и перенаправление пользователя

Question

В моем компоненте приложения я хочу проверить, аутентифицирован ли пользователь, как только он загружается, и если нет, сразу же перенаправить пользователя на общедоступную страницу вместо загрузки домашней страницы (профиля). Я использую сервис Auth0, который можно найти здесь: ссылка на файл GitHub

Вопрос в том, должен ли я запустить это в constructor или в ngOnInit и почему?

if (auth.isAuthenticated()) {
  router.navigateByUrl(...))
}

Answer 1

В общем, вы должны избегать размещения какой-либо бизнес-логики в конструкторе компонентов или директив.

Зачем?

Потому что во время выполнения конструктора для компонента Angular еще не инициализировал какие-либо входные данные, которые может иметь компонент (или директива). Таким образом, если логика инициализации зависит от значения его входных данных, эти входные данные не будут иметь своих правильных значений, что приведет к неправильной бизнес-логике.

Но моя инициализация компонента / директивы не зависит от ее входных данных!!

Это может быть правдой сейчас, но если / когда это изменится, теперь вы должны помнить, чтобы переместить всю свою логику с constructor в ngOnInit, который просто напрашивается на неприятности. И затем, вы получите эту несогласованность, когда некоторые компоненты используют конструктор для логики инициализации, а другие используют ngOnInitи это ненужное несоответствие также просто вызывает проблемы по мере разработки вашего приложения. По этой же причине настоятельно рекомендуется всегда добавлять @Injectable Декоратор для всех сервисов, даже если технически он вам нужен, только если ваш сервис использует внедрение зависимостей - всегда добавляйте его, чтобы не забыть сделать это позже, когда он вам действительно понадобится.

TLDR;

Для обеспечения согласованности и дальнейшего устранения проблем с отладкой используйте конструктор в своих компонентах только для захвата инъекционных объектов в качестве свойств - поместите всю остальную логику в ngOnInit,

НОТА

Однако, как указал @DeborahK, в этой конкретной ситуации, когда вы хотите существенно предотвратить маршрутизацию компонента, если не выполняется определенное условие, лучшим решением может быть защита маршрутизатора. Эта функция маршрутизатора вообще предотвращает инициализацию компонента, если не выполняется какое-либо условие.

Answer 2

Возможно, вы захотите добавить его в средство защиты маршрута вместо того, чтобы добавить его в конструктор компонента /ngOnInit.

У меня есть пример здесь: https://github.com/DeborahK/Angular-Routing

Увидеть auth.service.ts а также auth-guard.service.ts файлы в папке пользователя. В этом примере не используется Auth0, но в нем есть угловая "сантехника".

Answer 3

Вы можете создать фабрику для проверки входа в систему с помощью API вызова.

.factory('check_login_session', function ($rootScope,ApiService,ApiEndpoint ,$location,$cookies,$timeout) {
        return {
            success :  function(response) {

                var check_login ={
                    wut_token : $cookies.user_details
                };
              return ApiService.postModel(ApiEndpoint.Models.check_login,check_login).then(function (response) {
                    if (response.SUCCESS == "FALSE") {
                         $location.path("staticpage");
                     } else {

                        return response.SUCCESS;
                    }
                })

            }
        }
    });

В контроллере

check_login_session.success().then(function(res) {
            if(res == "TRUE"){
               //do as you want
            }
        });