javascript - 在手动引导 Angular 应用程序之前调用服务方法

Question

我已通读 this question and answer但不要相信这是解决我的问题的方法。

我有一个应用程序，在加载该应用程序之前需要当前登录用户的详细信息。这似乎与 this question 非常相似但不同之处在于，我想在引导应用程序之前使用我的 authenticationService 中已经存在的方法，并将结果缓存在该服务中。

app.bootstrap.js

(function(){
    'use strict';

    fetchUser()
        .then(bootstrapApplication);

    function fetchUser() {
        var injector = angular.injector(['app']);
        var authenticationService = injector.get('authenticationService');

        return authenticationService.getUser().then(function(response) {
          // Got user successfully, user is now cached in authenticationService.user
          console.log(response.data);
        });
    }

    function bootstrapApplication() {
        angular.element(document).ready(function() {
          angular.bootstrap(document, ['app']);
      });
    }

})();

我可以很好地调用该服务方法，但是当我引导应用程序并创建该服务的一个新实例时，问题就来了，结果，我从 HTTP 请求中缓存的数据位于服务。

authentication.service.js

(function(){
    'use strict';

    angular
        .module('app.authentication')
        .factory('authenticationService', authenticationService);

    authenticationService.$inject = ['$http', '$cookies', '$log', '$q', 'API_SETTINGS', '_'];

    function authenticationService($http, $cookies, $log, $q, API_SETTINGS, _) {
        var factory = {
            user          : {},
            login         : login,
            logout        : logout,
            getUser       : getUser,
            isLoggedIn    : isLoggedIn,
            getSessionId  : getSessionId
        };

        return factory;

        function getUser() {
            return $http.get(API_SETTINGS.url + '/account', { 
                params: { 
                    'api_key'     : API_SETTINGS.key,
                    'session_id'  : $cookies.get('sessionId')
                }})
            .then(function(response) {
                // Great, cache the user and return the response
                factory.user = response.data;
                return response;
            });
        }

    }

})();

无论如何，我是否可以使用我的 authenticationService 的相同实例在引导之前和之后进行 HTTP 调用？或者有其他选择吗？

我考虑过的一件事是在 fetchUser 成功回调中将用户附加到 window 以便在我的 authenticationService 中我可以设置 factory.user = $window.user || {}，但我不希望这样做。

Answer 1

您可以从另一个方向来解决这个问题 - 让您的 Angular 应用程序启动并在安全服务初始化之前阻止您的 UI 执行任何操作。

//~ ...

/**
 * Make UI Router wait.
 */
config(function($urlRouterProvider) {
    $urlRouterProvider.deferIntercept();
}).

/**
 * Initialize security and then activate UI Router.
 */
run(function($urlRouter, securityManager) {
    securityManager.init().then(function() {
        $urlRouter.sync();
        $urlRouter.listen();
    });
}).

//~ ...