1. Firebase synax

2. Firebase usage

DEMO：git clone https://github.com/rhildred/firebasetodo.git

open firebase：https://console.firebase.google.com/

      -  create new project

　　- realtime database: change its rule to public

　　- project setting： find the config, and then paste to firebase.js

  apiKey: "AIzaSyCbgXrV1bbY_nJ1GwwYeFqYlOO0dzxNSDQ",
  authDomain: "test1-89c24.firebaseapp.com",
  projectId: "test1-89c24",
  storageBucket: "test1-89c24.appspot.com",
  messagingSenderId: "845740612813",
  appId: "1:845740612813:web:a0c094ef21a40a8d749d84",
  measurementId: "G-00V4RGNLYE"

- Linux command:   npx http-server 

(node js app ( npx http-server ) is an HTTP server itself and it serves your static files to the browser.)

- Effect:

port 8080 is like:

 at the same time, in firebase realtime database:

3. Firebase Application: save payal details to realtime database 

DEMO: git clone https://github.com/rhildred/twiliobot2021.git

 3.1 add files under static folder

firebase.js 

export default {
    apiKey: "AIzaSyCbgXrV1bbY_nJ1GwwYeFqYlOO0dzxNSDQ",
    authDomain: "test1-89c24.firebaseapp.com",
    projectId: "test1-89c24",
    storageBucket: "test1-89c24.appspot.com",
    messagingSenderId: "845740612813",
    appId: "1:845740612813:web:a0c094ef21a40a8d749d84",
    measurementId: "G-00V4RGNLYE"
  };

order.js

import "https://cdnjs.cloudflare.com/ajax/libs/firebase/7.24.0/firebase-app.js";
import "https://cdnjs.cloudflare.com/ajax/libs/firebase/7.24.0/firebase-database.js"
// Your web app's Firebase configuration
import firebaseConfig from "./firebase.js";

// Initialize Firebase
firebase.initializeApp(firebaseConfig);

window.fireorder = (order)=>{
    const todoID = new Date().toISOString().replace(".", "_");
    firebase.database().ref('orders/' + todoID).set(order).then(() => {
        alert('Order saved.');
        window.open("", "_self");
        window.close(); 
    }).catch(e => {
        console.log(e.toString());
    });

}

3.2  ShawarmaOrder.js

add  <script src="/js/order.js" type="module"></script>  at line 87, so it will affect payal website

line 104 when transaction succeed, invoke firebase function to save details.

 $.post(".", details, ()=>{
                    window.fireorder(details);
                  });

标签：test1,firebase,system,js,Firebase,89c24,ready,com
来源： https://www.cnblogs.com/sabertobih/p/16065454.html