JavascriptとFirebase 3 - 電子メールとパスワードでユーザーを作成する

Question

jqueryとfirebaseを使用して登録システムを作成しようとしていますが、問題の原因は 'firebaseの呼び出し'が返すものが分からないことです。私は私のコードでお見せしましょう：（無関係なコードを除去することにより、簡素化）

HTML：

<div id="registerForm"> 
    <input type="text" id="userEmail" placeholder="Email"> 
    <input type="password" id="userPass" placeholder="Password"> 
    <button type="button" id="register">Register</button> 
</div> 

jQueryの（再び、唯一Firebaseに関連するコードと登録を示す）：

<script src=" /* Jquery url */ "></script> 
<script src=" /* Firebase url */ "></script> 
<script> 

    // Initialize Firebase 
    var config = { 
     apiKey: "*my api key*", 
     authDomain: "*myProject*.firebaseapp.com", 
     databaseURL: "https://*myProject*.firebaseio.com", 
     storageBucket: "*myProject*.appspot.com", 
    }; 
    firebase.initializeApp(config); 
</script> 
<script> 
    $('#register').click(function() { 

     var email = $('#userEmail');  
     var pass = $('#userPass');  

     if(email.val() && pass.val()){ 
      // this is where I stop knowing how all this firebase stuff works 


      firebase.auth().createUserWithEmailAndPassword(email.val(), pass.val()).catch(function(error) { 
       var errorCode = error.code; 
       var errorMessage = error.message; 
       console.log(errorCode + ' - ' + errorMessage); 
      }); 

      // This is where it doesn't wanna work. Please check the first paragraph below 
      // for the explanation of how it doesn't work. 
      console.log('this message shouldn\'t show if there wasn\'t an error.'); //This fires before firebase.auth()... for some reason 
      if(error) { 
       console.log('there was an error'); 
      } else { 
       console.log('everything went fine'); 
      }     
     } else { 
      console.log('fill in both fields'); 
     } 
    }); 
</script> 

firebase.authメソッドが返すものをチェックするif-else文がここにあります。エラーの場合は、成功メッセージを表示せずにエラーを表示し、他のユーザの詳細をuserDetails dbテーブルなどに格納しますが、ここに置いたコードはfirebase.authメソッドの前に実行されるようです。問題は、firebaseの戻り変数が呼び出され、if（firebase.auth.success（または何でも））{} else {}のようなことができるかどうかわからないということです。

上記のコードは、登録が成功した場合のように、新しいユーザーがfirebaseに表示され、エラーがあった場合に印刷してエラーを表示できます。問題は、firebaseへの成功/不成功の呼び出しを処理する方法と、後で書かれたコードがfirebaseの呼び出しの前に実行されているような事実を知らないことです。

実際のコードで間違いではなく、それをSOにコピーするのは間違いだったので、スペルミスや文法ミスを無視してください。

ご協力いただきありがとうございます。

Answer 1

createUserWithEmailAndPasswordは、成功した場合に.then()、エラーが発生した場合に.catch()をコールバックするようにアシンクロコールされています。あなたの現在のコードは、エラーがあったとしても、if(error)をチェックするまでにfirebase呼び出しが完了していない場合に検証しようとしています。

if(email.val() && pass.val()){ 

    firebase.auth().createUserWithEmailAndPassword(email.val(), pass.val()).then(function(user){ 
     console.log('everything went fine'); 
     console.log('user object:' + user); 
     //you can save the user data here. 
    }).catch(function(error) { 
     console.log('there was an error'); 
     var errorCode = error.code; 
     var errorMessage = error.message; 
     console.log(errorCode + ' - ' + errorMessage); 
    }); 

} else { 
    console.log('fill in both fields'); 
} 

：

あなたが探しているべきであることは以下のとおりです。