Как вы загружаете данные асинхронно при загрузке углового модуля?

Question

В моем угловом приложении мне нужно прочитать некоторые данные с сервера, прежде чем разрешить запуск остальной части моего приложения. Например, мне нужна аутентификация пользователя, чтобы я мог проверить его разрешение, прежде чем разрешить ему доступ ко всему. Поскольку мне нужно сделать это при запуске приложения, и я не знаю, какой контроллер будет загружен первым, я не могу использовать функцию разрешения метода $ routeProvider.when, потому что я не знаю, какой контроллер будет запущен первым, и это происходит только один раз при запуске приложения.

Я продолжаю делать что-то в методе module.run, но не могу найти способ предотвратить его продолжение, пока не получу данные с сервера. Я нашел это, но он страдает от той же проблемы: AngularJS: Инициализировать службу с асинхронными данными.

Я также могу выполнить ручную загрузку, но не могу найти хороших примеров того, как это сделать. Буду признателен за любую помощь, которую вы можете предоставить.

Answer 1

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

Возможные решения:

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

Реализуйте аутентификацию в вашем API. Вы можете проверить, вошел ли пользователь с помощью responseInterceptor:

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

  //setup your routes here...   

  var authChecker = ['$location', '$q', function($location, $q) {
      //redirects the user to /login page if he's not authorized (401)
      function success(response) {
          return response;
      }

      function error(response) {

          if(response.status === 401) {
              $location.path('/login');
              return $q.reject(response);
          }
          else {
              return $q.reject(response);
          }
      }

      return function(promise) {
          return promise.then(success, error);
      }
  }];

  $httpProvider.responseInterceptors.push(authChecker);
}])

Смотрите $ http документы для более подробной информации.

Обходной путь: запустить область

Не решает проблемы безопасности, но тоже работает:

Получите ваши данные в блоке запуска следующим образом:

.run(function($http,$location,$rootScope) {
    $rootScope.$on("$routeChangeStart", function (event, next, current) {
        if($rootScope.gotData) {
             $location.path(next.path);
        } else {
            $location.path('/loading');
        }
    });

    $http.get('path/to/data').success(function() {
        $rootScope.gotData = true;
        $location.path('/home');
    }).error(function() {
        $location.path('/404');
    })
})

см. документы для получения дополнительной информации.

Answer 2

Самый простой способ, которым я могу придумать, это создать отдельную страницу для входа. Как только пользователь аутентифицирован, разрешите ему только доступ к основному приложению (угловое приложение).

Также вам необходимо обезопасить свои сервисные ресурсы от несанкционированного запроса. Это защитит ваш контроллер от просмотра неавторизованных данных.