javascript - 使用 AngularFire 和 AngularJS 登录 Firebase 后如何重定向到 URL?

标签 javascript angularjs authentication firebase angularfire

用户登录后,我希望网页重定向。我尝试了两种不同的方法来实现这一点:

  • 在 '$scope.auth.$authWithOAuthPopup('google',AuthHandler)()' 之后添加一行重定向 url
  • 添加一个 AuthHandler,如果登录成功则重定向到不同的页面

尽管登录有效,但由于未知原因重定向无效。

<html ng-app="app">
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
        <script src="https://cdn.firebase.com/js/client/2.0.2/firebase.js"></script>
        <script src="https://cdn.firebase.com/libs/angularfire/0.9.0/angularfire.min.js"></script>
        <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
        <script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
        <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    </head>
<body ng-controller="ctrl">
  <p>Welcome, {{user.google.displayName}}</p>
  <button class="btn btn-lg btn-danger" id="Gbtn" ng-click="GoogleLogin()">
    <i class="fa fa-google-plus-square fa-2x"></i>
    Login with Google</button>  
</body>
</html>

Javascript

<script>
function AuthHandler(error, authData) {
  if (error) {
    console.log("Login Failed!", error);
  } else {
    console.log("Authenticated successfully with payload:", authData);
    window.location.href = "explore.html";
  }
} 

var app = angular.module("app", ["firebase"]);

  app.service("Ref", ["https://crowdfluttr.firebaseio.com/", Firebase]);

  app.factory("Auth", ["$firebaseAuth", "Ref", function($firebaseAuth, Ref) {
    return $firebaseAuth(Ref);
  }]);

  app.controller("ctrl", ["$scope","Auth", function($scope,Auth) {
    $scope.auth = Auth;

    $scope.GoogleLogin = function () {   
      $scope.auth.$authWithOAuthPopup('google',AuthHandler)()
      window.location.href = "explore.html";
    };

  }]);

  app.run(["$rootScope", "Auth", function($rootScope, Auth) {
    $rootScope.user = Auth.$getAuth();
  }]);

此外,请参阅此处的代码笔:http://codepen.io/chriscruz/pen/YPGeYx?editors=101

最佳答案

在这种情况下,您必须手动重定向。使用 $state.go('说明去哪里') 状态可以使用 $stateProvider 定义。

查看以下 2 个教程以了解 $stateProvider 的基础知识

  1. http://learn.ionicframework.com/formulas/navigation-and-routing-part-1/

  2. http://learn.ionicframework.com/formulas/navigation-and-routing-part-2/

关于javascript - 使用 AngularFire 和 AngularJS 登录 Firebase 后如何重定向到 URL?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27661926/

相关文章:

javascript - 从另一个文件加载 Angular

Angularjs 将对象传递给指令

javascript - 这段 JavaScript 代码有什么不同吗?

c# - Windows 应用商店应用程序 - C# - Https 客户端身份验证

javascript - 为什么使用只返回参数的函数

javascript - 在 Cloudfront 后面时,.net webforms 站点中缺少 WebResource.axd

javascript - 将自定义属性分配给动态生成的 JS 函数

javascript - map 深入收藏

android - 如何在android中向url添加 header 参数并从json url获取值

iphone - 显示带有 Storyboard的一次性登录屏幕的最佳实践