Как обновить базу данных Firestore, используя JS eventListener для отправки формы - PullRequest
0 голосов
/ 25 января 2020

Знакомство с обновлением базы данных Firestore с помощью формы html. Когда я жестко кодирую .set вне прослушивателя событий, он обновляет базу данных, но когда я пытаюсь сделать то же самое внутри прослушивателя событий, я получаю такие ошибки, что они не могут получить доступ к бэкэнду Cloud Firestore и что XMLHTTPRequest не может загрузить сайт из-за прав контроля доступа. Я установил его так, чтобы любой мог получить доступ к базе данных, поэтому я не понимаю, почему она не работает.

document.getElementById("pushMe").addEventListener("click", function submitForm(){
    let first_name = document.getElementById("firstname").value;
    let last_name = document.getElementById("lastname").value;
    console.log(first_name, last_name);

    docref.set({
        first_name: first_name,
        last_name: last_name
    }, { merge: true }).then(function(){
        console.log("User saved!");
    }).catch(function(error){
        console.log("Error: ", error);
    });

   db.collection("test").doc("test_user").get().then(function(doc) {
        if (doc.exists) {
            console.log("Document data:", doc.data());
        } else {
            // doc.data() will be undefined in this case
            console.log("No such document!");
        }
    }).catch(function(error) {
        console.log("Error getting document:", error);
    });

   console.log("GOODBYE!");
});

Вот код прослушивателя событий, который я пытаюсь использовать. Когда я извлекаю блок decree.set из этой функции, он обновляет базу данных, как и положено. У нас есть форма html, и мы хотим, чтобы она отправлялась при нажатии кнопки отправки.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="https://www.gstatic.com/firebasejs/7.7.0/firebase-app.js"></script>
    <script type="text/javascript" src="https://www.gstatic.com/firebasejs/7.7.0/firebase-firestore.js"></script>
</head>
<body>

<h2>HTML Forms</h2>

<form id="submit1">
    First name:<br>
    <input id= "firstname" type="text" name="firstname">
    <br>
    <input id= "lastname" type="text" name="lastname">
    <br><br>
    <button type="submit" id="pushMe"> Submit! </button>
</form>

<script type="text/javascript" src="web_app_test.js"></script>
</body>
</html>

Кто-нибудь еще сталкивался с этими проблемами?

ошибка контроля доступа ??

Ответы [ 2 ]

1 голос
/ 25 января 2020

где определяется "docref"? что-то не так с этим

, если вы пытаетесь добавить пользователя, и вам не важно, каким будет идентификатор, попробуйте:

db.collection("test").add({
    first_name: first_name,
    last_name: last_name
}).then(function(){
    console.log("User saved!");
}).catch(function(error){
    console.log("Error: ", error);
});

, используя .set() для когда вы хотите установить идентификатор вручную, например:

db.collection("test").doc("manually set id").set({...stuff})
0 голосов
/ 25 января 2020

Добро пожаловать! Три вопроса, которые могут помочь:

  1. Разве docref не должно быть db.collection("test").doc("test_user"), так как это то, что вы в итоге get осознаете? В конечном счете, я предполагаю, что вы захотите установить идентификатор do c динамически, например, ...doc(firstNameLastNameRandomNum), поэтому вам нужно сохранить вызов set в переменной, а затем сослаться на него через .id - но прямо сейчас вы жестко закодировали его как 'test_user'

  2. Возможно ли, что данные не были установлены во время вашего вызова get? Возможно, вам понадобится соединить вызов get как другой then на конце. В противном случае, я не думаю, что ваш get обязательно будет ждать, пока ваш set закончится. (Я могу ошибаться!)

  3. Наконец, вы основываете свой пример на этой базе Firebase до c? https://firebase.google.com/docs/firestore/manage-data/add-data#set_a_document Если это так, я часто обнаруживал, что документы Firebase будут использовать стенографию, которая была получена из более раннего do c, например, db был бы определен где-то раньше как firebase.firestore(), поэтому вы можете вернуться к ним, чтобы увидеть, не существует ли какой-то скрытый контекст для образца.

Удачи!

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