簡體   English   中英

Firebase 無法使用電子郵件和密碼注冊用戶

[英]Firebase cannot signup users with email and password

我正在使用 firebase 在我的網站上使用電子郵件和密碼注冊用戶。 我在我的控制台上啟用了電子郵件和密碼注冊。 當我在網頁上注冊用戶時,用戶電子郵件和密碼不會傳遞給 Firebase,也不會顯示任何錯誤。

她是我的前端代碼

<!DOCTYPE html>
<html>
<head>
  <title>Registration </title>
  <link rel="stylesheet" type="text/css" href="style.css">
  <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase.js"></script>
  <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase-database.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script src="signup.js" defer></script>
</head>

<body>    
  <form id="form">
    <div class="header">
        <h2>Sign up as a Language Learner</h2>
    </div>
    <div class="input">
      <input id="username" type="text" name="username" placeholder="Username">
    </div>
    <div class="input">
      <input id="email" type="email" name="email" placeholder="Email">
    </div>
    <div class="input">
      <input id="password1" type="password" name="password_1" placeholder="Password">
    </div>
    <div class="input">
      <input id="password2" type="password" name="password_2" placeholder="Confirm Password">
    </div>
    <div>
      <p id="message">
      </p>
    </div>
    <div class="input">
      <button id="register_button" class="btn" name="signup">Register</button>
        <p class="input">Already a member? <a href="login.html">Sign in</a>
       &nbsp <a href="/">Cancel</a>
      </p>
    </div>
  </form>
  <div id="signup_success">
    <h2>Sign-up Successful!</h2>
  </div>

</body>
</html>

這是我的 signup.js 文件:

var password2 = document.querySelector("#password2").value;
var register_button = document.querySelector("#register_button");
var config = {
  apiKey: "111",
  authDomain: "222",
  databaseURL: "333",
  projectId: "444",
  storageBucket: "555",
  messagingSenderId: "666"
};
firebase.initializeApp(config);

register_button.onclick = function() {
  var email = document.querySelector("#email").value;
  var password1 = document.querySelector("#password1").value;
  firebase.auth().createUserWithEmailAndPassword(email, password1).catch(function(error) {
    alert("hello");
    var errorCode = error.code;
    var errorMessage = error.message;
    document.querySelector("#message").innerHTML = errorCode + ": " + errorMessage;
  })
}

我使用控制台中的數據正確設置了配置。 如果我去掉register_button.onclick = function()firebase.auth().createUserWithEmailAndPassword執行。 我試圖添加register_button.addEventListener("click", register_user, false); 最后,它也不起作用。

我不知道這有什么問題,非常感謝任何幫助和建議。 提前致謝。

*編輯:感謝下面的@Fire-in-D-Hole,這是由於我在 HTML 中的標簽,使用標簽與我們在 Firebase 上提交的內容混淆。 經驗教訓:在使用 Firebase 時切勿使用

你的代碼是絕對正確的。 但是,在createUserWithEmailAndPassword(email, password1)方法中似乎有一個額外的空間導致了這個問題。

請將其更改為createUserWithEmailAndPassword(email,password1)

此外,當我點擊注冊時,您似乎正在使用Form Tag並且地址欄中顯示了值(見下文)。 建議您檢查,因為您可能不想在地址欄中顯示詳細信息。 在此處輸入圖片說明

用戶注冊截圖:

在此處輸入圖片說明

最后,您使用兩個字段作為密碼,確保您編寫了兩個密碼字段必須匹配的邏輯。 在下面添加我嘗試過的代碼,它沒有表單標簽。

 var password2 = document.querySelector("#password2").value; var register_button = document.querySelector("#register_button"); var config = { apiKey: "111", authDomain: "1111", databaseURL: "1111", projectId: "1111", storageBucket: "11111", messagingSenderId: "111" }; firebase.initializeApp(config); register_button.onclick = function() { var email = document.querySelector("#email").value; var password1 = document.querySelector("#password1").value; var password2= document.querySelector("#password2").value; //alert("heyman im in register button"); //console.log("Email" +email); // console.log("password1 Value" +password1); // console.log("password2 Value" +password2); firebase.auth().createUserWithEmailAndPassword(email, password1).catch(function(error) { //alert("hello"); var errorCode = error.code; var errorMessage = error.message; document.querySelector("#message").innerHTML = errorCode + ": " + errorMessage; }); }
 <!DOCTYPE html> <html> <head> <title>Registration </title> <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase.js"></script> <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase-app.js"></script> <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase-auth.js"></script> <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase-database.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="https://www.gstatic.com/firebasejs/5.8.6/firebase.js"></script> <script src="signup.js" defer></script> </head> <body> <div class="header"> <h2>Sign up as a Language Learner</h2> </div> <div class="input"> <input id="username" type="text" name="username" placeholder="Username"> </div> <div class="input"> <input id="email" type="email" name="email" placeholder="Email"> </div> <div class="input"> <input id="password1" type="password" name="password_1" placeholder="Password"> </div> <div class="input"> <input id="password2" type="password" name="password_2" placeholder="Confirm Password"> </div> <div> <p id="message"> </p> </div> <div class="input"> <button id="register_button" class="btn" name="signup">Register</button> <p class="input">Already a member? <a href="login.html">Sign in</a> &nbsp <a href="/">Cancel</a> </p> </div> <div id="signup_success"> <h2>Sign-up Successful!</h2> </div> </body> </html>

您需要使用.onAuthStateChanged觀察器來處理登錄狀態更改。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM