'A promise is returned instead of firebase data

How can I fix this? I have no idea what event loops, promises, async or await are. You can send me a link to an explanation, or just write me an explanation. However, this is not the main issue. The issue is that I am trying to get firebase data in a function starting on line 38, and I am getting [Object object] instead of the data. But, if I look into the firebase console, it's giving me [Object Promise] Here is the code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p id="i"></p>
    <script type="module">
        // Import the functions you need from the SDKs you need
        import { initializeApp } from "https://www.gstatic.com/firebasejs/9.6.7/firebase-app.js";
        import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.6.7/firebase-analytics.js";
        import { getDatabase, ref, set, get, child} from "https://www.gstatic.com/firebasejs/9.6.7/firebase-database.js";
        // TODO: Add SDKs for Firebase products that you want to use
        // https://firebase.google.com/docs/web/setup#available-libraries
      
        // Your web app's Firebase configuration
        // For Firebase JS SDK v7.20.0 and later, measurementId is optional
        const firebaseConfig = {
          apiKey: "AIzaSyCnfB3Tfu9bo7PyEvhB1ZAPBbit7ZWm9D8",
          authDomain: "square-1cdce.firebaseapp.com",
          projectId: "square-1cdce",
          storageBucket: "square-1cdce.appspot.com",
          messagingSenderId: "82191280296",
          appId: "1:82191280296:web:45e62faffbb7e8a94cfa9d",
          measurementId: "G-NT53HS3WE9"
        };
      
        // Initialize Firebase
        const app = initializeApp(firebaseConfig);
        const analytics = getAnalytics(app);
        const db = getDatabase()
        const dbRef = ref(getDatabase());
        var data={};
        var x=prompt("Message:")
get(child(dbRef, "text")).then((snapshot) =>function(){
  if (snapshot.exists()) {
    data=snapshot.val()
  } else {
    data="No data available"
  }
}).catch((error) => {
  console.error(error);
});
        set(ref(db, 'text/'), {
          texts: get(ref(db, 'text/'))+"<br>"+x
        });
        document.getElementById("i").innerHTML= data;
        </script>
</body>
</html>

Ps. I am a ten-year-old learning javascript. My father signed me up for classes.

Pss. I made the read and write values in the rules true, so anybody can change the data with this code.

javascript firebase-realtime-database

Solution 1:^[1]

You're making the write more complication than needed.

set(ref(db, 'text/'), {
  texts: get(ref(db, 'text/'))+"<br>"+x
      // ? This is not needed      ? 
});

To write the value of x to the database, you can do:

set(ref(db, 'text/'), {
  texts: x
});

If you want to append the value of x to the current value in the database, you'll need to use a transaction instead of set:

runTransaction(ref(db, 'text/texts'), (text) => {
  return text + "<br>" + x;
});

A better way to store multiple values is to use a list though, in which can you can append the value of x to that list with:

push(ref(db, 'text/texts'), x);

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Frank van Puffelen

'A promise is returned instead of firebase data

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]