javascript - 数据不会在 javascript 中进入 firebase 数据库
问题描述
这里我使用的是firebase auth,所以我还将用户提供的数据上传到firebase实时数据库中,但我的数据只有在服务器启动时才会发送一次,如果我在启动serer时一次性添加更多用户然后数据不会进入火力基地,甚至不会显示任何错误,工作顺利。一个警告即将到来。
我不知道问题出在哪里,因为 user.uid 也打印得很好,用户名也打印得很好。
这是我的代码
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Firebase Server Auth</title>
<link rel="stylesheet" href="/css/mvp.css" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/js-cookie@rc/dist/js.cookie.min.js"></script>
</head>
<body>
<section>
<form id="signup">
<label>
Username
</label>
<input type="text" name="username" id="username" required/>
<label>Full Name</label>
<input type="text" name="name" id="name" required/>
<label>Email</label>
<input type="text" name="email" id="email" required/>
<label>Contact</label>
<input type="number" name="phone" id="phone" required/>
<label>Password</label>
<input type="password" name="password" id="password" required/>
<button type="submit" id="signup">Sign up</button>
</form>
<form action="/login" method="GET">
<button type="submit">Having Account</button>
</form>
</section>
<script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-database.js"></script>
<script>
var firebaseConfig = {
apiKey: "",
authDomain: "",
databaseURL: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: "",
measurementId: ""
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
firebase.auth().setPersistence(firebase.auth.Auth.Persistence.NONE);
document
.getElementById("signup")
.addEventListener("submit", (event) => {
event.preventDefault();
var email = document.getElementById("email").value;
var password = document.getElementById("password").value;
var username = document.getElementById("username").value;
var name = document.getElementById("name").value;
var phone = document.getElementById("phone").value;
firebase
.auth()
.createUserWithEmailAndPassword(email, password)
.then(({
user
}) => {
console.log(user.uid)
console.log(username);
firebase.database().ref(user.uid).set({
"Username": username,
"Name": name,
"Phone": phone,
"Email": email
});
return user.getIdToken().then((idToken) => {
return fetch("/sessionLogin", {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
"CSRF-Token": Cookies.get("XSRF-TOKEN"),
},
body: JSON.stringify({
idToken
}),
});
});
})
.then(() => {
window.location.assign("/login");
}).catch(err => {
alert("Email Already exist");
window.location.assign("/login");
console.log(err);
})
return false;
});
</script>
</body>
</html>
解决方案
这可能是因为您将submit
类型分配给按钮:您的表单是在触发 Firebase 方法之前提交的。createUserWithEmailAndPassword()
您应该将按钮类型更改为button
(有关按钮类型的更多详细信息,请参见W3 规范)。
类似于以下内容(未经测试):
<form id="signup">
//...
<button type="button" id="signupButton">Sign up</button>
</form>
//...
<script>
var firebaseConfig = {
//...
};
// Initialize Firebase
//...
document
.getElementById("signupButton")
.addEventListener("click", function() => {...})
推荐阅读
- css - CSS如何在输入框的末尾有一个图像
- javascript - 在 Safari 中从 https://example.com 向 http://127.0.0.1:8766/test/ 发送请求
- javascript - Reactjs Javascript if/else 无法正常工作
- bash - Bash:根据文件名排序文件
- python - 如何检查时间戳列表的元素是否在包含时间戳的系列中?
- python - 在 Node-RED 中使用 Python 节点而不暴露代码
- javascript - 在shopify中向product-card-grid.liquid写入函数时,Javascript简单函数未执行?
- ruby-on-rails - 如何使用 exec_params where params in ('','','')
- c# - 表单帖子字段之一返回 NULL .NET Core MVC
- java - mybatis中如何将String[]映射到PostgreSQL数组列