'db is undefined' проблема с интеграцией Firebase в JS - PullRequest
0 голосов
/ 25 марта 2020

Я делаю небольшую контактную форму на моем личном сайте. У меня проблема с интеграцией базы данных firebase с формой. Я прочитал документацию и посмотрел некоторые учебники по YT, но не могу найти ошибку. Не могли бы вы взглянуть? Я получаю сообщение об ошибке «db is undefined» в консоли.

window.onload = function() {
  var firebaseConfig = {
      apiKey: "sampleValue",
      authDomain: "sampleValue",
      databaseURL: "sampleValue",
      projectId: "sampleValue",
      storageBucket: "sampleValue",
      messagingSenderId: "sampleValue",
      appId: "sampleValue",
      measurementId: "sampleValue"
  };

  firebase.initializeApp(firebaseConfig);
  let db = firebase.firestore;

  function submitForm() {
    // e.preventDefault();

    let nameEl = document.getElementById("InputName");
    let emailEl = document.getElementById("InputEmail");
    let subjectEl = document.getElementById("InputSubject");
    let messageEl = document.getElementById("InputMessage");

    let nameValue = nameEl.value;
    let emailValue = emailEl.value;
    let subjectValue = subjectEl.value;
    let messageValue = messageEl.value;

    db.collection("contact").doc().set({
        name: nameValue,
        email: emailValue,
        subject: subjectValue,
        message: messageValue
      })
      .then(function() {
        alert("dataSaved");
      })
      .catch(function() {
        alert("error");
      });
  }
  document.getElementById("submit").addEventListener("click", submitForm());
};

Edit Мне удалось решить проблему благодаря коллегам @Kevin Peña и @Phix: отсутствует сценарий firebase-firestore. js в индексе. html

<script defer src="https://www.gstatic.com/firebasejs/7.12.0/firebase-firestore.js"></script>

Я понял, что настройки в моей БД не позволяют мне выводить что-либо из моей формы pu sh, поэтому я изменил правила на

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if true;
    }
  }
}

1 Ответ

1 голос
/ 25 марта 2020

Расширение немного на комментарий Фикса. Прямо здесь:

firebase.initializeApp(firebaseConfig);
let db = firebase.firestore; // <- here

Это должно быть

let db = firebase.firestore()

Вы можете найти это на Направляющие и на Ссылка .

Кроме того, здесь:

document.getElementById("submit").addEventListener("click", submitForm() /* <-over here */);

Вы не должны вызывать функцию, вместо этого передавайте ее addEventListener (т.е. просто его имя)

document.getElementById("submit").addEventListener("click", submitForm);

В противном случае форма будет отправлена пусто, когда страница загружается. И ничего не произойдет при нажатии кнопки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...