用户用Angularjs和Firebase登录

-1

我想找到一种方法来用Angularjs和Firebase创建一个简单的登录表单。我目前有一个简单的注册表单，它将一个userName添加到我的firebase数据库中。我需要知道的只是如何在firebase系统中标识userName后获取接受用户的登录页面，并且如果数据库中没有此类userName，可能会发生回调错误。这是我的注册表格：用户用Angularjs和Firebase登录

<html ng-app="myApp"> 
<body ng-controller="userCtrl"> 
    <div class="centerForm"> 

     <form> 
      <div class="form-group"> 
      <label for="exampleInputUser">Username</label> 
      <input type="username" ng-model="userName" class="form-control" id="exampleInputUser" placeholder="username"> 
      </div> 
      <div class="form-group"> 
      <label for="exampleInputPassword1">Password</label> 
      <input type="password" ng-model="userPassword" class="form-control" id="exampleInputPassword1" placeholder="Password"> 
      </div> 
      <table class="nav" align="center"> 
      <tr> 
       <td> 
        <p><button type="submit" class="btn btn-primary" ng-click="saveUser()">Submit</button> 
        <a href="#" class="btn btn-info" role="button">Sign Up</a></p> 
       </td> 
      </tr>  
      </table> 
     </form> 

    </div> 
</body> 
</html>

，这是我的注册代码：

<script> 
      angular.module('myApp', []) 
      .controller('userCtrl', function($scope) { 
       $scope.userName =""; 
       $scope.userPassword=""; 

       $scope.myData = new Firebase("https://myfirebaseapp.firebaseio.com/") 

       $scope.saveUser = function() { 
        $scope.myData.push({userName: $scope.userName}); 
       }; 

       }); 





    </script>

我的登录表单，然后会看起来像：

<html ng-app="myApp"> 
<body ng-controller="userCtrl"> 
    <div class="centerForm"> 

     <form> 
      <div class="form-group"> 
      <label for="exampleInputUser1">Username</label> 
      <input type="username" ng-model="userName" class="form-control" id="exampleInputUser1" placeholder="username"> 
      </div> 
      <div class="form-group"> 
      <label for="exampleInputPassword1">Password</label> 
      <input type="password" ng-model="userPassword" class="form-control" id="exampleInputPassword1" placeholder="Password"> 
      </div> 
      <table class="nav" align="center"> 
      <tr> 
       <td> 
        <p><button type="submit" class="btn btn-primary" ng-click="loginUser()">Submit</button> 
        <a href="#" class="btn btn-info" role="button">Sign Up</a></p> 
       </td> 
      </tr>  
      </table> 
     </form> 

    </div> 
</body> 
</html>

来源

2016-03-04 Alex Hughes

你的代码只把用户名的火力点，它实际上没有创建一个帐户，所以你应该在您实际登录前先修复此问题。 –

我使用的角度JS而我在Firebase中的登录功能如下所示：

app.factory("Auth", ["$firebaseAuth",function($firebaseAuth) { 
var ref = new Firebase("https://myfirebaseapp.firebaseio.com"); 
return $firebaseAuth(ref); 
}]); 

$scope.login = function() { 
    $scope.authObj.$authWithPassword({ 
     name: $scope.data.name, 
     email: $scope.data.email, 
     password: $scope.data.password 
    }).then(function(authData) { 
     authenticated = true; 
     console.log("Logged in as:", authData.uid, authenticated); 
     $location.path("profile"); 
     check(); 
    }).catch(function(error) { 
     authenticated = false; 
     console.error("Authentication failed:", error); 
     check(); 
    }); 
}

来源

2016-03-04 15:10:06

AngularFire存在此原因 - 将Angular与Firebase绑定。

下面是一个工作示例。这是登录控制器：

var app = angular.module('appName'); 

app.factory("Auth", ["$firebaseAuth", 
    function($firebaseAuth) { 
    var ref = new Firebase("https://yourtester.firebaseio.com"); 
    return $firebaseAuth(ref); 
    } 
]); 

app.controller('loginCtrl', ['$scope', '$state', '$http', 'Auth', 
    function($scope, $state, $http, Auth) { 
    $scope.auth = Auth; 
    $scope.auth.$onAuth(function(authData) { 
     $scope.authData = authData; 
    }); 
    $scope.login = function() { 
     Auth.$authWithPassword({ 
     email: $scope.email, 
     password: $scope.password 
     }) 
     .then(function(authData) { 
     console.log('Logged in as:', authData.uid); 
     //$state.go('profile'); 
     }) 
     .catch(function(err) { 
     console.log('error:',err); 
     //$state.go('login'); 
     }); 
    }; 
    } 
]);

这是login.html的文件：

<body ng-app='appName' ng-controller="loginCtrl"> 
    <h1>Login!</h1> 
    <form ng-submit='login()'> 
     <div class="form-group"> 
     <label for="email">Email address</label> 
     <input id="email" ng-model='email' type="email" placeholder="Email" required> 
     </div> 
     <div class="form-group"> 
     <label for="password">Password</label> 
     <input id="password" ng-model='password' type="password" placeholder="Password" required> 
     </div> 
     <button class="btn btn-success">Login</button> 
    </form>

来源

2016-03-04 17:50:06 mdegges

此代码如何通过检查账户是否在数据库中来验证任何登录？ – Ufomammut

用户用Angularjs和Firebase登录

回答

相关问题