Tải Firebase SDK từ các URL đặt trước

Firebase Hosting đặt trước các URL trong trang web của bạn bắt đầu bằng /__. Không gian tên được đặt trước này giúp bạn dễ dàng sử dụng các sản phẩm Firebase khác cùng với Firebase Hosting.

Các URL được đặt trước này có sẵn cả khi bạn triển khai lên Firebase (firebase deploy) hoặc khi bạn chạy ứng dụng trên máy chủ cục bộ (firebase serve).

Thêm tập lệnh cho URL được đặt trước

Firebase Hosting được phân phát qua HTTP/2 khi được triển khai, nên bạn có thể tăng hiệu suất bằng cách tải các tệp từ cùng một nguồn gốc. Firebase Hosting phân phát phiên bản 8 của SDK Firebase JavaScript từ các URL đặc biệt có định dạng như sau:

/__/firebase/JS_SDK_VERSION/FIREBASE_SDK_NAME.js

Bạn chỉ nên tải thư viện mà bạn sử dụng trong ứng dụng. Ví dụ: để chỉ bao gồm AuthenticationCloud Firestore, hãy thêm các tập lệnh sau vào cuối thẻ <body>, nhưng trước khi bạn sử dụng bất kỳ dịch vụ Firebase nào:

<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>

Tự động định cấu hình SDK

Cấu hình SDK tự động giúp bạn dễ dàng quản lý nhiều môi trường (chẳng hạn như môi trường phát triển, môi trường thử nghiệm và môi trường phát hành chính thức) từ một cơ sở mã duy nhất. Bằng cách dựa vào URL Hosting được đặt trước, bạn có thể triển khai cùng một mã cho nhiều dự án Firebase.

Ngoài việc lưu trữ chính các SDK, không gian tên được đặt trước cũng cung cấp tất cả cấu hình cần thiết để khởi chạy SDK cho dự án Firebase liên kết với trang web Hosting. Cấu hình Firebase và quá trình khởi chạy SDK này được cung cấp bởi một tập lệnh mà bạn có thể đưa trực tiếp vào:

<!-- Load the Firebase SDKs before loading this file -->
<script src="/__/firebase/init.js"></script>

Khi bạn triển khai lên Firebase hoặc kiểm thử ứng dụng trên máy, tập lệnh này sẽ tự động định cấu hình SDK Firebase JavaScript cho dự án Firebase đang hoạt động và khởi chạy SDK.

Nếu bạn muốn tự kiểm soát quá trình khởi chạy, các giá trị cấu hình Firebase cũng có sẵn ở dạng JSON:

fetch('/__/firebase/init.json').then(async response => {
  firebase.initializeApp(await response.json());
});

Các SDK Firebase JS hiện có (từ URL Hosting được đặt trước)

Sản phẩm Firebase Tham chiếu thư viện (URL được đặt trước)
Firebase core
(bắt buộc)
<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>
Lượt cài đặt Firebase
<script src="/__/firebase/8.10.1/firebase-installations.js"></script>
Cloud Messaging
<script src="/__/firebase/8.10.1/firebase-messaging.js"></script>

Để có trải nghiệm tối ưu khi sử dụng Cloud Messaging, hãy thêm SDK Firebase cho Analytics.

Cloud Storage
<script src="/__/firebase/8.10.1/firebase-storage.js"></script>
Performance Monitoring
(bản phát hành beta)
<script src="/__/firebase/8.10.1/firebase-performance.js"></script>
Realtime Database
<script src="/__/firebase/8.10.1/firebase-database.js"></script>
Remote Config
(bản phát hành beta)
<script src="/__/firebase/8.10.1/firebase-remote-config.js"></script>

Để có trải nghiệm tối ưu khi sử dụng Remote Config, hãy thêm SDK Firebase cho Analytics.

Firebase JavaScript SDK
(toàn bộ SDK)
<script src="/__/firebase/8.10.1/firebase.js"></script>

Trợ giúp xác thực

Firebase Authentication sử dụng không gian tên được đặt trước để cung cấp JavaScript và HTML đặc biệt nhằm hoàn tất quá trình xác thực với các nhà cung cấp thông qua OAuth. Điều này cho phép mỗi dự án Firebase có một miền con Firebase duy nhất, giúp tăng cường bảo mật cho Firebase Authentication.

Ngoài ra, việc này cho phép bạn sử dụng miền tuỳ chỉnh của riêng mình cho tuỳ chọn authDomain của firebase.initializeApp(). Nếu định cấu hình một miền tuỳ chỉnh cho Firebase Hosting, thì bạn cũng có thể chỉ định miền tuỳ chỉnh đó (thay vì miền con web.app hoặc firebaseapp.com) khi khởi chạy SDK Firebase. Hãy xem bài viết Các phương pháp hay nhất để sử dụng signInWithRedirect để biết thêm thông tin chi tiết về cách sử dụng miền tuỳ chỉnh.

URL được đặt trước và trình chạy dịch vụ

Nếu đang tạo một Ứng dụng web tiến bộ (PWA), bạn có thể tạo một trình chạy dịch vụ có "lựa chọn dự phòng điều hướng" và hiển thị một URL cụ thể theo mặc định nếu URL đó không khớp với danh sách các mục được lưu vào bộ nhớ đệm trước.

Nếu đang sử dụng thư viện sw-precache, bạn có thể thêm chế độ cài đặt danh sách trắng dự phòng điều hướng để loại trừ vùng chứa tên được đặt trước:

{
  navigateFallbackWhitelist: [/^(?!\/__).*/]
}

Nhìn chung, bạn chỉ cần nhớ rằng không gian tên dấu gạch dưới đôi được dành riêng cho việc sử dụng Firebase và bạn không nên chặn các yêu cầu này trong worker dịch vụ.