Firebase $authWithOAuthRedirect 在没有页面刷新的情况下不会调用 $onAuth

Question

我按照 Ionic Firebase Facebook 登录的 official tutorial 设置了一个简单的 Firebase Facebook OAuth 登录，如下所示。

问题是，一旦我点击使用 Facebook 登录按钮，我就会被重定向到 Facebook，我登录，然后被重定向回我的应用程序。但是，问题是我停留在登录页面。奇怪的是，如果我通过按 F5 物理刷新浏览器（使用 ionic serve 进行测试），onAuth 触发器将被重定向到 Items 页面。如果我不刷新浏览器，就不会调用 onAuth。

有人遇到过这个问题吗？你是怎么解决的？

请注意，是的，我做了我的研究（并且有点开始失去它），但无法让它工作。我搜索了 SO，尝试使用 google 组中的 $timeout，尝试调用 $scope.$apply()，但都无济于事 - 请帮我弄清楚我哪里做错了？

.controller('AppCtrl', function($scope, Items, Auth, $state, $ionicHistory) {
    $scope.login = function(provider) {
        Auth.$authWithOAuthRedirect(provider).then(function(authData) {

        }).catch(function(error) {
            if (error.code === "TRANSPORT_UNAVAILABLE") {
                Auth.$authWithOAuthPopup(provider).then(function(authData) {
                    
                });
            } else {
                console.log(error);
            }
        });
    };

    $scope.logout = function() {
        Auth.$unauth();
        $scope.authData = null;

        $window.location.reload(true);
    };

    Auth.$onAuth(function(authData) {
        if (authData === null) {
            console.log("Not logged in yet");
            $state.go('app.login');
        } else {
            console.log("Logged in as", authData.uid);
            
            $ionicHistory.nextViewOptions({
                disableBack: true
              });
            $state.go('app.items');
        }
        $scope.authData = authData; // This will display the user's name in our view
    });
})

<ion-view view-title="Members area">
    <ion-content padding="true">
        <div ng-if="!authData">
            <button class="button button-positive button-block" ng-click="login('facebook')">Log In with Facebook</button>  
        </div>       
        
        <div ng-if="authData.facebook">
            <div class="card">
                <div class="item item-text-wrap">Hello {{authData.facebook.displayName}}!</div>                
            </div>

            <button class="button button-assertive button-block" ng-click="logout()">Log out</button>
        </div>        

    </ion-content>
</ion-view>

编辑： 我通过使用 $timeout:

解决了它

$timeout(function(){
    Auth.$onAuth(function(authData) {
        if (authData === null) {
            console.log("Not logged in yet");
            $state.go('app.login');
        } else {
            console.log("Logged in as", authData.uid);

            $ionicHistory.nextViewOptions({
                disableBack: true
              });
            $state.go('app.items');
        }
        $scope.authData = authData; // This will display the user's name in our view
    });
}, 3000);

不过这样感觉不对（委婉点），肯定有更好的方法，求指教。另外，我注意到高达 3 秒的延迟几乎不够（我发现很少有资源建议 500 毫秒就足够了，但就我而言，情况并非如此）。

Answer 1

发表在 github 个问题上，但也会在这里回复。

这只会在使用 $authWithOAuthRedirect 的浏览器中发生。该示例适用于 cordova 应用程序，因此这真的不应该成为问题。

但如果你真的需要它，你可以跳过重定向并使用弹出窗口。

    Auth.$authWithOAuthPopup(authMethod).then(function(authData) {
      console.dir(authData);
    });

Answer 2

这是一个错误，已在最新的 Firebase JS 客户端版本 (2.3.0) 中修复。您现在可以使用 $authWithOAuthRedirect，当您返回页面时将触发 $onAuth 回调。

Firebase $authWithOAuthRedirect 在没有页面刷新的情况下不会调用 $onAuth

Firebase $authWithOAuthRedirect doesn't call $onAuth without page refresh

angularjs

firebase

angularfire

ionic-framework

ionic