วิธีอื่นๆ ในการเพิ่ม Firebase ลงในโปรเจ็กต์ JavaScript

สําหรับเว็บแอป Firebase ส่วนใหญ่ เราขอแนะนําอย่างยิ่งให้ใช้ SDK ผ่าน npm อย่างไรก็ตาม สำหรับผู้ใช้ที่มีข้อกำหนดพิเศษ Firebase มีวิธีอื่นๆ ในการเพิ่ม SDK หน้านี้แสดงวิธีการตั้งค่าโดยละเอียดสำหรับวิธีการสำรองเหล่านี้

  • CDN (เครือข่ายนำส่งข้อมูล)
  • npm สำหรับแอป Node.js

เมื่อใช้วิธีการเหล่านี้ คุณจะเพิ่มไลบรารีที่พร้อมใช้งาน ลงในแอปได้

จาก CDN

คุณสามารถกำหนดค่าการนำเข้าบางส่วนของ Firebase JavaScript SDK และโหลดเฉพาะผลิตภัณฑ์ Firebase ที่ต้องการได้ Firebase จัดเก็บไลบรารีแต่ละรายการของ Firebase JavaScript SDK ใน CDN (เครือข่ายนำส่งข้อมูล) ทั่วโลกของเรา

  1. หากต้องการรวมเฉพาะผลิตภัณฑ์ Firebase ที่เฉพาะเจาะจง (เช่น Authentication และ Cloud Firestore) ให้เพิ่มสคริปต์ต่อไปนี้ ที่ด้านล่างของแท็ก <body> ก่อนใช้บริการ Firebase:

    <body>
  <!-- Insert this script at the bottom of the HTML, but before you use any Firebase services -->
  <script type="module">
    import { initializeApp } from 'https://www.gstatic.com/firebasejs/12.0.0/firebase-app.js'

    // If you enabled Analytics in your project, add the Firebase SDK for Google Analytics
    import { getAnalytics } from 'https://www.gstatic.com/firebasejs/12.0.0/firebase-analytics.js'

    // Add Firebase products that you want to use
    import { getAuth } from 'https://www.gstatic.com/firebasejs/12.0.0/firebase-auth.js'
    import { getFirestore } from 'https://www.gstatic.com/firebasejs/12.0.0/firebase-firestore.js'
  </script>
</body>

  2. เพิ่มออบเจ็กต์การกำหนดค่า Firebase แล้วเริ่มต้น Firebase ในแอปของคุณ

    <body>
  <script type="module">
    // ...

    // TODO: Replace the following with your app's Firebase configuration
    const firebaseConfig = {
      // ...
    };

    // Initialize Firebase
    const app = initializeApp(firebaseConfig);
  </script>
</body>

แอป Node.js

  1. ติดตั้ง Firebase JavaScript SDK โดยทำดังนี้

    1. หากยังไม่มีไฟล์ package.json ให้สร้างโดย เรียกใช้คำสั่งต่อไปนี้จากรูทของโปรเจ็กต์ JavaScript 

      npm init

    2. ติดตั้งfirebaseแพ็กเกจ npm และบันทึกลงในไฟล์ package.jsonโดยเรียกใช้คำสั่งต่อไปนี้

      npm install --save firebase@12.0.0

  2. ใช้ตัวเลือกใดตัวเลือกหนึ่งต่อไปนี้เพื่อใช้โมดูล Firebase ในแอป

    • คุณสามารถrequireโมดูลจากไฟล์ JavaScript ใดก็ได้

      หากต้องการรวมเฉพาะผลิตภัณฑ์ Firebase ที่เฉพาะเจาะจง (เช่น Authentication และ Cloud Firestore) ให้ทำดังนี้

      // Firebase App (the core Firebase SDK) is always required and
// must be listed before other Firebase SDKs
var firebase = require("firebase/app");

// Add the Firebase products that you want to use
require("firebase/auth");
require("firebase/firestore");


    • คุณสามารถใช้ไวยากรณ์ ESM เพื่อimportโมดูล

      หากต้องการรวมเฉพาะผลิตภัณฑ์ Firebase ที่เฉพาะเจาะจง (เช่น Authentication และ Cloud Firestore) ให้ทำดังนี้

      // Firebase App (the core Firebase SDK) is always required and
// must be listed before other Firebase SDKs
import firebase from "firebase/app";

// Add the Firebase services that you want to use
import "firebase/auth";
import "firebase/firestore";

  3. เพิ่มออบเจ็กต์การกำหนดค่า Firebase แล้วเริ่มต้น Firebase ในแอปของคุณ

    import { initializeApp } from 'firebase/app';

// TODO: Replace the following with your app's Firebase configuration
const firebaseConfig = {
  //...
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);