【问题标题】:Javascript Create-Account Not Linking To Firebase DatabaseJavascript 创建帐户未链接到 Firebase 数据库
【发布时间】:2019-12-11 14:50:58
【问题描述】:

我在index.html 文件中设置了一个注册表单并将其连接到index.js,这样当用户在相应的框中输入他们的电子邮件和密码并单击“提交”按钮时,它会将他们的详细信息添加到数据库中。

但是,没有向数据库添加任何内容,控制台中也没有给出错误。 'firebase-database' 已包含在 html head 标记中。

这是 HTML 文件:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Hobbyist</title>
    <link rel="stylesheet" href="style.css" />
    <link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet">
    <script src="https://www.gstatic.com/firebasejs/5.8.1/firebase.js"></script>
    <script src="https://www.gstatic.com/firebasejs/5.8.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/5.8.1/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/5.8.1/firebase-database.js"></script>
    <script src="https://cdn.firebase.com/libs/firebaseui/3.1.1/firebaseui.js"></script>
    <link type="text/css" rel="stylesheet" href="https://cdn.firebase.com/libs/firebaseui/3.1.1/firebaseui.css" />
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
    <script type = "text/javascript" src="index.js"></script>
  </head>
  <body>
  <div id="sign-up">
    <h2>SIGN UP</h2>
    <form action="index.html" method="post">
      <input type="email" placeholder="Email..." id="create-email"><p />
      <input type="password" placeholder="Password..." id="create-password"><p />

      <button class="button" id="create-account">CREATE ACCOUNT</button>
    </form>
  </div>
  </body>
</html>

这里是 JavaScript 文件:

    (function() {
      // the config details have been removed for security reasons
      var config = {
      apiKey: "---",
      authDomain: "---",
      databaseURL: "---",
      projectId: "---",
      storageBucket: "---",
      messagingSenderId: "---"
    };
    firebase.initializeApp(config);

    $(document).ready(() => {
      $('#create-account').click(() => {
        var email = document.getElementById('create-email').value;
        var password = document.getElementById('create-password').value;

        var db = firebase.database();

        db.ref('users/' + email).set({
          email: email,
          password: password
        });
      });
    });

 }());

我已经搜索并搜索了一种将信息添加到数据库的方法,但没有找到任何东西。有什么建议吗?

【问题讨论】:

  • 您应该通过 API 执行此操作,否则您将显示配置数据。一个巨大的安全问题。
  • 是的 - 我稍后会保护它,谢谢 :) 你对如何让数据库正常工作有什么想法吗?

标签: javascript jquery forms firebase firebase-realtime-database


【解决方案1】:

我们需要在这里查看 HTML 以及报告某种形式的错误。正在捕获的点击事件可能已关闭。控制台中没有任何内容的事实需要检查,因为 Firebase SDK 中当前有一些内容表明它将被弃用。我还将提出一个建议,将用户发布到用户参考而不是您上面的参考。 Firebase 的文档存储功能将有助于您在此处尝试完成的工作。

var db = firebase.database()
db.ref("/users").set({
  email: email,
  password: password
});

我要在这里检查的另一件事是 .push() 用于 firebase 的方法。 set() 方法将覆盖数据库中的任何用户。

归根结底,这里有一些问题需要回答才能做出准确的解决方案。

【讨论】:

  • 当我在由 Firebase 托管的站点中使用表单时,它会给出错误 Uncaught Error: Reference.child failed: First argument was an invalid path = "users/example@example.com". Paths must be non-empty strings and can't contain ".", "#", "$", "[", or "]"。我还更新了原始帖子以包含 index.html` 文件。
  • 是的,如果您使用当前方法,它将发布到尚未创建的参考。您需要按照上面的建议使用db.ref("/users"),因为这将允许您发布到用户参考。您设置它的当前方式是指 1.) 不存在的东西和 2.)example@example.com 不是数据库中对象的标识,因此它通常不会找到它。 firebase.google.com/docs/reference/js/…
  • 我试过这个,但它仍然没有给Realtime Database添加任何东西(我已经用.push().set()尝试过)。另外,什么是“文档存储”能力?
猜你喜欢
  • 1970-01-01
  • 2018-06-06
  • 2016-11-01
  • 2017-10-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-05-18
相关资源
最近更新 更多