我正在做一个小项目，学习如何使用Firebase。我在这里做了一个简单的html表单：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>EduVerse - Sign Up</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/sign-up.css">
<script src="https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.js"></script>
<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.css" />
</head>
<body>
<div class="form_container">
<div class="title_container">
<p class="title">Create a new Account</p>
<span class="subtitle">Already have an account? <a href="sign-in.html">Sign In</a></span>
</div>
<br>
<div class="bottom-sect">
<div class="left">
<div class="input_container">
<label class="input_label" for="user_field">User Name</label>
<input placeholder="Name1234" name="input-name" type="text" class="input_field" id="username">
</div>
<div class="input_container">
<label class="input_label" for="email_field">Email</label>
<input placeholder="name@mail.com" name="input-name" type="text" class="input_field" id="email">
</div>
<div class="input_container">
<label class="input_label" for="password_field">Password</label>
<input placeholder="Password" name="input-name" type="password" class="input_field" id="password">
</div>
<button type="submit" class="sign-up_btn" id="signUp">
<span>Sign Up</span>
</button>
</div>
<div class="separator">
<span>Or</span>
</div>
<div class="right">
<button type="submit" class="sign-up_ggl">
<span>Sign Up with Google</span>
</button>
<button type="submit" class="sign-up_apl">
<span>Sign Up with Apple</span>
</button>
</div>
</div>
<p class="note">Terms of use & Conditions</p>
</form>
</body>
<script type="module" src="js/sign-up.js"></script>
</html>我正在尝试设置身份验证，当我点击注册按钮时，它甚至没有在屏幕上生成错误消息警报。
// Import the functions you need from the SDKs you need
import { initializeApp } from "https://www.g static.com/firebasejs/9.17.2/firebase-app.js";
import { getDatabase } from "https://www.gstatic.com/firebasejs/9.17.2/firebase-database.js";
import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.17.2/firebase-analytics.js";
import { getAuth, createUserWithEmailAndPassword } from "https://www.gstatic.com/firebasejs/9.17.2/firebase-auth.js";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaSyDqWEjfCm8D-bvD-Zt_UhBZzScgzGaL-v0",
authDomain: "eduverse-7d36a.firebaseapp.com",
projectId: "eduverse-7d36a",
storageBucket: "eduverse-7d36a.appspot.com",
messagingSenderId: "706418380914",
appId: "1:706418380914:web:ab8091755c0204c4e272eb",
measurementId: "G-V57JJGKFR8"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
const database = getDatabase(app);
const auth = getAuth();
signUp.addEventListener('click', (e) => {
var username = document.getElementById("username").value;
var email = document.getElementById("email").value;
var password = document.getElementById("password").value;
createUserWithEmailAndPassword(auth, email, password)
.then((userCredential) => {
// Signed in
const user = userCredential.user;
alert("userInitialized");
})
.catch((error) => {
const errorCode = error.code;
const errorMessage = error.message;
alert(errorMessage);
});
})如果任何人有任何建议，我非常感谢。
1条答案
按热度按时间jgwigjjp1#
您的问题很可能是因为表单是在Firebase
createUserWithEmailAndPassword()方法被触发之前提交的。不要使用
submit类型作为按钮，而使用button类型，因为它不会提交表单：有关更多详细信息，请参见W3关于按钮类型的规范。