无法在 Glitch 上使用 Javascript 写入 Firebase 数据库

问题描述 投票：0回答：2

我正在尝试创建一个简单的应用程序来添加到 Firebase 数据库。

写入温度，然后将其与时间戳一起存储在数据库中。但由于某种原因它不起作用。我尝试了多种不同的方法并检查了 Firebase 网站上的所有文档，但没有任何效果。任何帮助将不胜感激。谢谢

https://glitch.com/edit/#!/lcjs

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <script src="https://www.gstatic.com/firebasejs/7.3.0/firebase-app.js"></script>
    <title>Write to firebase</title>
  </head>  
  <body>
    <h1>Current Tempature</h1>

    Tempature <input type="text" id="UserData"/>
    <input type="button" id="Submit" onclick="formSubmission()" value="Submit"/>

    <p id="done">
    </p>

    <script src="script.js"></script>
  </body>
</html>

脚本.JS

// Your web app's Firebase configuration
var firebaseConfig = {
    apiKey: "AIzaSyDvLIcv7nEIbfnz99mhoLi8UizaJcZxHLM",
    authDomain: "lcls-332a0.firebaseapp.com",
    databaseURL: "https://lcls-332a0.firebaseio.com",
    projectId: "lcls-332a0",
    storageBucket: "lcls-332a0.appspot.com",
    messagingSenderId: "604417688851",
    appId: "1:604417688851:web:63eb89e29b81cd1a8546e6",
    measurementId: "G-N2TVNX43T6"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();

function formSubmission(){
  document.getElementById("done").innerHTML = "Clicked";
  var today = new Date();
  var timestamp = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds() + " " + today.getDate() + "/" + today.getMonth() + "/" + today.getFullYear();

  var myDBConn = firebase.database().ref();
  document.getElementById("done").innerHTML = "Done";
  var TempBranch = myDBConn.child("MyTempatures");

  var currentTemp = document.getElementbyID("UserData");

  TempBranch.push({ Tempature: parseInt[currentTemp.value], Time: timestamp });

  document.getElementById("done").innerHTML =
    "Your result has been successfully added!";
}
javascript firebase firebase-realtime-database glitch-framework
2个回答
0
投票

当我运行您的 Glitch 项目并提交值时，我在 Chrome 的 JavaScript 控制台中看到此错误：

script.js:26 未捕获的类型错误：document.getElementbyName 不是函数

在表单提交（script.js:26）

在 HTMLInputElement.onclick ((index):11)

没有办法

document.getElementbyName
。您可能想使用 
document.getElementsByTagName
或 
document.getElementById
。

您问题中的代码中存在相同类型的错误方法名称，其中有

getElementbyID
。您可能也指的是 
document.getElementById
。

密切注意拼写和大写/小写是个好主意，因为在阅读代码时很容易忽视它们，但要区分工作代码和非工作代码。

0
投票

来自 Glitch.com 支持

“您好 - 看来您是从重新混合我们的 React starter 开始的，这是一个生成的静态站点，没有服务器 - 容器上的服务器供 Vite 将静态文件构建到构建文件夹中，然后进行部署。不过，您的应用程序需要数据库/API 端点的全栈功能，因此此设置不适合您。

因为带有 React 前端和像 MongoDB 这样的数据库的全栈应用程序有点大（并且通常需要多个端口，而我们不提供），所以它们不太适合单个 Glitch 应用程序。您可能想要尝试为生成的静态站点使用一个应用程序，并让它对另一个与您要使用的数据库进行全堆栈的应用程序进行 API 调用。在 Glitch 论坛中询问此问题的解决方案是一件好事 - 那里可能有一些创作者已经获得了这样的设置来工作。

或者，如果您同意不使用 React 而只需要任何类型的数据库，我们这里有一个 sqlite 入门工具：https://glitch.com/edit/#!/glitch-hello-sqlite?path=src %2Findex.jsx%3A1%3A0"

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.