Firebase SimpleLogin에서 각도 해결을 사용합니다.

Question

저는 SimpleLogin 인증과 각도 j의 해결을 통합하고 싶습니다. 다음을 시도했습니다 :

app.config(function($routeProvider) { 
$routeProvider.when("/login", { 
    templateUrl: "templates/authentication.html", 
    controller: "AuthenticationController", 
    resolve: { 
     authenticated_user: function($q, $timeout) { 
      var deferred = $q.defer(); 
      var ref = new Firebase("https://theuy-angularfire.firebaseio.com/"); 

      var auth = new FirebaseSimpleLogin(ref, function(error, user) { 
       if (error) { 
       deferred.resolve(null); 
       } else if (user) { 
       console.log('User ID: ' + user.id + ', Provider: ' + user.provider); 
       deferred.resolve(user); 
       } else { 
       deferred.resolve(null); 
       } 
      }); 

      return deferred.promise; 
     } 
    } 
}); 

성공적으로 로그인했지만 서식 파일이 렌더링되지 않았을 때 콜백이 표시됩니다. 해결 방법과 함께 Firebase SimpleLogin 인증을 사용하는 방법에 대한 조언을 해 주실 수 있습니까?

Answer 1

나는 문제가 무엇인지 알고 있다고 생각합니다.

Angular의 Resolve 기능은 클라이언트 측 작업이므로 실행이 빨라지는 반면 SimpleLogin은 서버에 연결하여 응답을 기다려야합니다. 문제는 Angular가 인증 프로세스의 결과 전에 템플릿을 확인하고 렌더링하려고 시도했기 때문입니다.

그래서 먼저 인증 프로세스를 수행 한 다음 수동으로 각도를 부트 스트랩하여 해결 기능을 실행하는 솔루션을 생각해 냈습니다. 해결책은 다음과 같습니다.

var app = angular.module("myapp", ["firebase"]); 
app.user = null; 
app.ref = null; 
app.auth = null; 
// when the dom is ready, so we sure we can bootstrap angular manually 
angular.element(document).ready(function() { 
    app.ref = new Firebase("https://theuy-angularfire.firebaseio.com/"); 
    app.auth = new FirebaseSimpleLogin(app.ref, function (error, user) { 
     app.user = user; 
     angular.bootstrap(document, ['myapp']); 
    }); 
}); 
// this object is needed when we want to authenticate somewhere in our application with the use of resolve 
var authentication = { 
    app: function ($q, $location) { 
     var deferred = $q.defer(); 

     // go to the dashboard when the user is logged in 
     if (app.user != null) { 
      $location.path("/dashboard"); 
      deferred.resolve(app.user); 
     } else { 
      // go to the login form when the user is logged logged out, or never had logged in 
      $location.path("/login"); 
      deferred.resolve(null); 
     } 
     return deferred.promise; 
    } 
} 

app.config(function ($routeProvider) { 
    $routeProvider.when("/login", { 
     templateUrl: "templates/loginform.html", 
     resolve: authentication, 
     controller: "LoginController" 
    }); 

    $routeProvider.when("/dashboard", { 
     templateUrl: "templates/dashboard.html", 
     resolve: authentication, 
     controller: "DashboardController" 
    }); 
});