Môi trường được hỗ trợ
SDK Firebase JavaScript được hỗ trợ chính thức trong các môi trường sau.
Trình duyệt
| Sản phẩm Firebase | Edge | Firefox | Chrome | Safari trên iOS | Safari |
|---|---|---|---|---|---|
| App Check | |||||
| Analytics | |||||
| Authentication | |||||
| Cloud Firestore | (ngoại trừ vĩnh viễn) |
(ngoại trừ vĩnh viễn nếu iOS < 10) |
|||
| Cloud Functions | |||||
| Lượt cài đặt Firebase | |||||
| Cloud Messaging | (Edge 17 trở lên, ngoại trừ thiết bị di động) |
||||
| Cloud Storage | |||||
| Performance Monitoring | |||||
| Realtime Database | |||||
| Remote Config | |||||
| Vertex AI in Firebase |
Các môi trường khác
| Sản phẩm Firebase | React Native | Node.js (18+) | Tiện ích của Chrome |
Cordova |
|---|---|---|---|---|
| App Check | (sử dụng nhà cung cấp tuỳ chỉnh để chứng thực thiết bị gốc) |
(sử dụng nhà cung cấp tuỳ chỉnh) |
||
| Analytics | ||||
| Authentication | (xem Lưu ý) |
(xem Lưu ý) |
(xem Lưu ý) |
(xem Lưu ý) |
| Cloud Firestore | (ngoại trừ vĩnh viễn) |
(ngoại trừ vĩnh viễn) |
||
| Cloud Functions | ||||
| Data Connect | ||||
| Lượt cài đặt Firebase | ||||
| Cloud Messaging | ||||
| Cloud Storage | (ngoại trừ nội dung tải lên) |
|||
| Performance Monitoring | ||||
| Realtime Database | ||||
| Remote Config | ||||
| Vertex AI in Firebase |
Tiện ích bổ sung
SDK Firebase JavaScript được xây dựng dựa trên các tiêu chuẩn mới nhất của nền tảng web. Một số trình duyệt cũ và môi trường JavaScript không hỗ trợ tất cả các tính năng mà Firebase yêu cầu. Nếu phải hỗ trợ các trình duyệt/môi trường này, bạn cần tải polyfill tương ứng.
Các phần dưới đây xác định hầu hết các polyfill mà bạn có thể cần.
Các polyfill bắt buộc
| Môi trường | Tiện ích bổ sung |
|---|---|
| Safari 7, 8 và 9 | ES Bản chính thức |
| Nút < 10 | ES Bản chính thức |
Tiện ích bổ sung không bắt buộc
| Môi trường | Tiện ích bổ sung | Các sản phẩm của Firebase |
|---|---|---|
|
tìm nạp |
|
|
tìm nạp |
|
|
base-64 |
|
Các polyfill được đề xuất
| Tiện ích bổ sung | Giấy phép |
|---|---|
| ES Bản chính thức | MIT |
| tìm nạp – "tìm nạp chéo" – phù hợp nhất với các trình duyệt cũ | MIT |
| fetch – `undici` – phù hợp nhất với Node.js | MIT |
| base-64 | MIT |
Thiết lập Polyfill bắt buộc cho React Native và Expo
Đối với React Native và Expo, nếu bạn đang tải một chuỗi được mã hoá base-64 lên, bạn cần làm như sau:
Cài đặt base-64 từ npm:
npm install base-64
Nhập decode từ base-64 và đính kèm vào phạm vi toàn cục dưới dạng atob để Cloud Storage có thể truy cập.
import { decode } from 'base-64';
if(typeof atob === 'undefined') {
global.atob = decode;
}
Thêm polyfill vào ứng dụng
Cách 1: (Nên dùng) Sử dụng trình tạo gói tích hợp với Babel
Nếu bạn đang sử dụng trình tạo gói, hãy tích hợp với Babel và @babel/preset-env để lấy polyfill.
Hãy sử dụng hướng dẫn thiết lập tương tác của Babel để tìm hiểu cách tích hợp Babel với trình tạo gói.
Với Babel, bạn không cần phải lo lắng về việc thêm chính xác polyfill. Thay vào đó, bạn chỉ định các môi trường trình duyệt tối thiểu mà bạn cần hỗ trợ. Sau đó, Babel sẽ thêm các polyfill cần thiết cho bạn. Babel đảm bảo rằng bạn luôn đáp ứng các yêu cầu về hỗ trợ trình duyệt, ngay cả khi Firebase hoặc mã của riêng bạn bắt đầu sử dụng các tính năng ES mới.
@babel/preset-env có thông tin chi tiết về các tuỳ chọn cấu hình hiện có để chỉ định mục tiêu môi trường (tuỳ chọn targets) và thêm polyfill (tuỳ chọn useBuiltIns).
Cách 2: (Không nên dùng) Thêm polyfill theo cách thủ công
Bạn có thể thêm polyfill theo cách thủ công bằng cách sử dụng các thư viện polyfill mà bạn yêu thích (ví dụ: core-js).
import 'core-js/stable'
import 'cross-fetch/polyfill';
core-js cũng cung cấp một tệp polyfill tất cả trong một mà bạn có thể đưa trực tiếp vào trang HTML.
Tuỳ chọn này có thể là một cách thuận tiện để quản lý polyfill nếu bạn không sử dụng Babel. Tuy nhiên, bạn không nên sử dụng tuỳ chọn tất cả trong một này cho các ứng dụng chính thức vì tuỳ chọn này có thể bao gồm các polyfill không cần thiết, làm tăng trọng lượng trang và do đó làm tăng thời gian tải trang.