我正在尝试将数据发布到 firebase，但它没有被发布.. 我尝试使用 addEventListener 来发布数据，但没有成功。 这是我的 html，带有包含 firebase sdk 的外部 main.js:
<BODY>
<TABLE align="center">
<caption></caption>
<tr>
<td width=500 height=150 colspan=8 style="text-align: center"><strong
style="font-size:50">Add an Entry</strong></td>
</tr>
<tr>
<TD height=500 colspan=8>
<form id="info">
<table align="center">
<tr>
<td>Name:</td>
<th><INPUT type="text" Size="40" Maxlength="35"
Name="personal-name" id="name" placeholder="Your Name Here">
</th>
</tr>
<tr>
<td>Email:</td>
<th><INPUT type="text" Size="40" Maxlength="40"
Name="personal-email" id="email" placeholder="Your Email Here">
</th>
</tr>
<tr>
<td>Address:</td>
<th><textarea rows="5" width="550" type="text" Size="40"
Maxlength="40" Name="address" id="address"
placeholder="__"></textarea>
</th>
</tr>
</table>
<br>
<div align="center">
<button id="refresh">refresh</button>
<button id="addBtn" >submit</button>
</div>
</form>
</td>
</tr>
</Table>
</Body>
<script src="https://www.gstatic.com/firebasejs/7.16.1/firebase-app.js"></script>
<script src="main.js"></script> </BODY>
这是我的 main.js:
//Firebase 配置，然后是事件监听器
var firebaseConfig = {
apiKey: ******************************,
authDomain: ******************************,
databaseURL: ******************************,
projectId: ******************************,
storageBucket: ******************************,
messagingSenderId: ******************************,
appId: ******************************,
measurementId: ******************************,
};
firebase.initializeApp(firebaseConfig);
firebase.analytics();
form.addEventListener("submit", (e)=>{
e.preventDefault();
firebase.firestore().collection("information").add({
name:document.getElementById('name').value,
email:document.getElementById('email').value,
address:document.getElementById('address').value
})
});
最佳答案
4件事:
确保使用表单的 id 定义表单变量
const form = document.getElementById("info");
您缺少分析和 firestore sdk src(我包含了 auth，以防您打算使用它)
<!-- Firebase App (the core Firebase SDK) is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/7.16.1/firebase-app.js"></script>
<!-- If you enabled Analytics in your project, add the Firebase SDK for Analytics -->
<script src="https://www.gstatic.com/firebasejs/7.16.1/firebase-analytics.js"></script>
<!-- Add Firebase products that you want to use -->
<script src="https://www.gstatic.com/firebasejs/7.16.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.16.1/firebase-firestore.js"></script>
在 Firebase 控制台中，将数据库规则的条件更改为 true(如果尚未更改)
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
allow read, write: if true;
}
}
}
为了提高性能，您应该将产品初始化和集合存储在变量中
const analytics = firebase.analytics();
const firestore = firebase.firestore();
const information = firestore.collection("information");
const form = document.getElementById("info");
form.addEventListener("submit", (e)=>{
e.preventDefault();
information.add({
name:document.getElementById('name').value,
email:document.getElementById('email').value,
address:document.getElementById('address').value
})
});
或者，您可以创建一个带有名称的文档，以便更快地查询
information.doc(document.getElementById('name').value).set({
name:document.getElementById('name').value,
email:document.getElementById('email').value,
address:document.getElementById('address').value
})
关于javascript - 数据未发布..帮助! html、js、firebase，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/63025476/