Firebase Simple Loginにはメール/パスワードのオプションがありますが、どのように使用しますか?ユーザーの作成から始まり、そのユーザーのデータの保存から、ユーザーのログインとログアウトまで。
2 に答える
実行する3つの異なるステップがあります(jQueryがあると仮定しましょう):
1.コールバックを設定します
var ref = new Firebase("https://demo.firebaseio-demo.com");
var authClient = new FirebaseAuthClient(ref, function(error, user) {
if (error) {
alert(error);
return;
}
if (user) {
// User is already logged in.
doLogin(user);
} else {
// User is logged out.
showLoginBox();
}
});
2.ユーザー登録
function showLoginBox() {
...
// Do whatever DOM operations you need to show the login/registration box.
$("#registerButton").on("click", function() {
var email = $("#email").val();
var password = $("#password").val();
authClient.createUser(email, password, function(error, user) {
if (!error) {
doLogin(user);
} else {
alert(error);
}
});
});
}
3.ユーザーログイン
function showLoginBox() {
...
// Do whatever DOM operations you need to show the login/registration box.
$("#loginButton").on("click", function() {
authClient.login("password", {
email: $("#email").val(),
password: $("#password").val(),
rememberMe: $("#rememberCheckbox").val()
});
});
}
ログインが正常に完了すると、手順1で登録した呼び出しが正しいユーザーオブジェクトで呼び出されます。その時点でdoLogin(user)
、実装する必要のあるメソッドである呼び出しが行われます。
ユーザーデータの構造は非常に単純です。これは、次のプロパティを含むオブジェクトです。
email
:ユーザーのメールアドレス:ユーザーの
id
一意の数値(自動インクリメント)ID
FirebaseAuthClientは自動的にfirebsaeを認証しますが、それ以上のアクションは必要ありません。これで、セキュリティルールで次のようなものを使用できます。
{
"rules": {
"users": {
"$userid": {
".read": "auth.uid == $userid",
".write": "auth.uid == $userid"
}
}
}
}
つまり、ユーザーIDが42の場合、example.firebaseio-demo.com/users/42
ログインしているときは自分だけが書き込みまたは読み取りを行うことができ、他のユーザーは誰もできません。
Simple Loginは、IDと電子メール以外のユーザーに関する追加情報を保存しないことに注意してください。ユーザーに関する追加データを保存する場合は、自分で保存する必要があります(おそらくの成功コールバックでcreateUser
)。通常のFirebaseにデータを保存するのと同じように、このデータを保存できます。このデータの読み取りまたは書き込みができるユーザーに注意してください。
誰かがこのスレッドにアクセスし、Firebase認証を使用してサンプルアプリケーションを探している場合に備えて。これが2つの例です
var rootRef = new Firebase('https://docs-sandbox.firebaseio.com/web/uauth');
......
.....
....
http://jsfiddle.net/firebase/a221m6pb/embedded/result,js/
http://www.42id.com/articles/firebase-authentication-and-angular-js/