Firebase Hosting จะสงวน URL ในเว็บไซต์ของคุณที่ขึ้นต้นด้วย /__ เนมสเปซที่สงวนไว้นี้ช่วยให้ใช้ผลิตภัณฑ์อื่นๆ ของ Firebase ร่วมกับ
Firebase Hostingได้ง่ายขึ้น
URL ที่สงวนไว้เหล่านี้จะพร้อมใช้งานทั้งเมื่อคุณทําการติดตั้งใช้งานใน Firebase
(firebase deploy) หรือเมื่อคุณเรียกใช้แอปในเซิร์ฟเวอร์ภายใน
(firebase serve)
เพิ่มสคริปต์สำหรับ URL ที่สงวนไว้
เนื่องจาก Firebase Hosting จะแสดงผ่าน HTTP/2 เมื่อติดตั้งใช้งาน คุณจึงเพิ่มประสิทธิภาพได้โดยการโหลดไฟล์จากต้นทางเดียวกัน Firebase Hosting ให้บริการ เวอร์ชัน 8 ของ Firebase JavaScript SDK จาก URL พิเศษที่มีรูปแบบดังนี้
/__/firebase/JS_SDK_VERSION/FIREBASE_SDK_NAME.js
เราขอแนะนำเป็นอย่างยิ่งให้โหลดเฉพาะไลบรารีที่คุณใช้ในแอปเท่านั้น เช่น หากต้องการรวมเฉพาะ Authentication และ Cloud Firestore ให้เพิ่มสคริปต์ต่อไปนี้ที่ด้านล่างของแท็ก <body>
แต่ก่อนที่คุณจะใช้บริการ Firebase
<body>
<!-- Insert these scripts at the bottom of the HTML, but before you use any Firebase services -->
<!-- Firebase App (the core Firebase SDK) is always required and must be listed first -->
<script src="/__/firebase/8.10.1/firebase-app.js"></script>
<!-- Add Firebase products that you want to use -->
<script src="/__/firebase/8.10.1/firebase-auth.js"></script>
<script src="/__/firebase/8.10.1/firebase-firestore.js"></script>
</body>
การกำหนดค่า SDK อัตโนมัติ
การกำหนดค่า SDK อัตโนมัติช่วยให้จัดการสภาพแวดล้อมหลายอย่าง (เช่น dev, staging และ production) จากโค้ดเบสเดียวได้ง่าย การใช้ URL Hosting ที่สงวนไว้จะช่วยให้คุณสามารถติดตั้งใช้งานโค้ดเดียวกันในโปรเจ็กต์ Firebase หลายโปรเจ็กต์ได้
นอกจากจะโฮสต์ SDK เองแล้ว เนมสเปซที่สงวนไว้ยังมีการกำหนดค่าทั้งหมดที่จำเป็นต่อการเริ่มต้น SDK สำหรับโปรเจ็กต์ Firebase ที่เชื่อมโยงกับเว็บไซต์ Hosting ด้วย การกำหนดค่า Firebase และการเริ่มต้น SDK นี้มีให้ใช้งานผ่านสคริปต์ที่คุณรวมได้โดยตรง
<!-- Load the Firebase SDKs before loading this file -->
<script src="/__/firebase/init.js"></script>
เมื่อคุณติดตั้งใช้งานใน Firebase หรือทดสอบแอปในเครื่อง สคริปต์นี้จะกำหนดค่า Firebase JavaScript SDK สำหรับโปรเจ็กต์ Firebase ที่ใช้งานอยู่โดยอัตโนมัติ และเริ่มต้น SDK
หากต้องการควบคุมการเริ่มต้นด้วยตนเอง ค่าการกำหนดค่า Firebase จะอยู่ในรูปแบบ JSON ด้วย
fetch('/__/firebase/init.json').then(async response => {
firebase.initializeApp(await response.json());
});
Firebase JS SDK ที่ใช้ได้ (จาก URL Hosting ที่จองไว้)
| ผลิตภัณฑ์ Firebase | การอ้างอิงไลบรารี (URL ที่สงวนไว้) |
|---|---|
| Firebase Core (ต้องระบุ) |
<script src="/__/firebase/8.10.1/firebase-app.js"></script> |
| Analytics | <script src="/__/firebase/8.10.1/firebase-analytics.js"></script> |
| App Check | <script src="/__/firebase/8.10.1/firebase-app-check.js"></script> |
| Authentication | <script src="/__/firebase/8.10.1/firebase-auth.js"></script> |
| Cloud Firestore | <script src="/__/firebase/8.10.1/firebase-firestore.js"></script> |
| Cloud Functions for Firebase Client SDK | <script src="/__/firebase/8.10.1/firebase-functions.js"></script> |
| Firebase การติดตั้ง | <script src="/__/firebase/8.10.1/firebase-installations.js"></script> |
| Cloud Messaging | <script src="/__/firebase/8.10.1/firebase-messaging.js"></script> เพื่อประสบการณ์การใช้งาน Cloud Messaging ที่ดีที่สุด ให้เพิ่ม Firebase SDK สำหรับ Analytics ด้วย |
| Cloud Storage | <script src="/__/firebase/8.10.1/firebase-storage.js"></script> |
|
Performance Monitoring
(รุ่นเบต้า) |
<script src="/__/firebase/8.10.1/firebase-performance.js"></script> |
| Realtime Database | <script src="/__/firebase/8.10.1/firebase-database.js"></script> |
| Remote Config
(รุ่นเบต้า) |
<script src="/__/firebase/8.10.1/firebase-remote-config.js"></script> เพื่อประสบการณ์การใช้งาน Remote Config ที่ดีที่สุด ให้เพิ่ม Firebase SDK สำหรับ Analytics ด้วย |
| Firebase JavaScript SDK (SDK ทั้งหมด) |
<script src="/__/firebase/8.10.1/firebase.js"></script> |
ผู้ช่วยการตรวจสอบสิทธิ์
Firebase Authentication ใช้เนมสเปซที่สงวนไว้เพื่อจัดหา JavaScript และ HTML พิเศษเพื่อทำการตรวจสอบสิทธิ์กับผู้ให้บริการผ่าน OAuth ให้เสร็จสมบูรณ์ ซึ่งจะช่วยให้โปรเจ็กต์ Firebase แต่ละโปรเจ็กต์มีโดเมนย่อย Firebase ที่ไม่ซ้ำกัน เพื่อเพิ่มความปลอดภัยของ Firebase Authentication
นอกจากนี้ ยังช่วยให้คุณใช้โดเมนที่กำหนดเองสำหรับauthDomain
ตัวเลือกของ firebase.initializeApp() ได้ด้วย หากคุณกำหนดค่าโดเมนที่กำหนดเองสำหรับ Firebase Hosting คุณจะระบุโดเมนที่กำหนดเองนั้นได้ด้วย (แทนที่จะใช้โดเมนย่อย web.app หรือ firebaseapp.com) เมื่อเริ่มต้น Firebase SDK ดูรายละเอียดเพิ่มเติมเกี่ยวกับการใช้โดเมนที่กำหนดเองได้ที่แนวทางปฏิบัติแนะนำสำหรับการใช้ signInWithRedirect
URL และ Service Worker ที่สงวนไว้
หากคุณกำลังสร้าง Progressive Web App (PWA) คุณอาจสร้าง Service Worker ที่มี "การสำรองข้อมูลการนำทาง" และแสดงผล URL ที่เฉพาะเจาะจงโดยค่าเริ่มต้นหากไม่ตรงกับรายการที่แคชไว้ล่วงหน้า
หากใช้ไลบรารี sw-precache คุณสามารถเพิ่มการตั้งค่ารายการที่อนุญาตพิเศษสำหรับการสำรองข้อมูลการนำทางซึ่งยกเว้นเนมสเปซที่สงวนไว้ได้โดยทำดังนี้
{
navigateFallbackWhitelist: [/^(?!\/__).*/]
}
โดยทั่วไป โปรดทราบว่าเนมสเปซที่มีขีดล่าง 2 ขีดสงวนไว้สำหรับการใช้งาน Firebase และคุณไม่ควรสกัดกั้นคำขอเหล่านี้ใน Service Worker