สภาพแวดล้อมที่รองรับ Firebase JavaScript SDK

สภาพแวดล้อมที่รองรับ

ระบบรองรับ Firebase JavaScript SDK อย่างเป็นทางการในสภาพแวดล้อมต่อไปนี้

เบราว์เซอร์

ผลิตภัณฑ์ Firebase Edge Firefox Chrome Safari ใน iOS Safari
Firebase AI Logic 1
Analytics
App Check
Authentication
Cloud Firestore
(ยกเว้น
การคงอยู่)

(ยกเว้นการคงอยู่หาก iOS < 10)

Cloud Functions
Firebase การติดตั้งใช้งาน
Cloud Messaging
(Edge 17 ขึ้นไป ยกเว้นบนมือถือ)
Cloud Storage
SQL Connect
Performance Monitoring
Realtime Database
Remote Config

1 Firebase AI Logic ก่อนหน้านี้มีชื่อว่า "Vertex AI in Firebase"

สภาพแวดล้อมอื่นๆ

ผลิตภัณฑ์ Firebase React Native Node.js (18 ขึ้นไป) ส่วนขยาย
Chrome
Cordova
Firebase AI Logic 1
App Check
(ใช้ผู้ให้บริการที่กำหนดเองเพื่อทำการรับรองอุปกรณ์เนทีฟ)

(ใช้ผู้ให้บริการที่กำหนดเอง)
Analytics
Authentication
(ดูหมายเหตุ)

(ดูหมายเหตุ)

(ดูหมายเหตุ)

(ดูหมายเหตุ)
Cloud Firestore
(ยกเว้น
การคงอยู่)

(ยกเว้น
การคงอยู่)
Cloud Functions
SQL Connect
Firebase การติดตั้งใช้งาน
Cloud Messaging
Cloud Storage
(ยกเว้น
การอัปโหลด)
Performance Monitoring
Realtime Database
Remote Config

1 Firebase AI Logic ก่อนหน้านี้มีชื่อว่า "Vertex AI in Firebase"

Polyfill

Firebase JavaScript SDK สร้างขึ้นตามมาตรฐานล่าสุดของแพลตฟอร์มเว็บ เบราว์เซอร์และสภาพแวดล้อม JavaScript บางเวอร์ชันเก่าไม่รองรับฟีเจอร์ทั้งหมดที่ Firebase ต้องการ หากคุณต้องรองรับเบราว์เซอร์/สภาพแวดล้อมเหล่านี้ คุณจะต้องโหลด Polyfill ตามความเหมาะสม

ส่วนด้านล่างระบุ Polyfill ส่วนใหญ่ที่คุณอาจต้องใช้

Polyfill ที่จำเป็น

สภาพแวดล้อม Polyfill
Safari 7, 8 และ 9 ES Stable
Node < 10 ES Stable

Polyfill ที่ไม่บังคับ

สภาพแวดล้อม Polyfill ผลิตภัณฑ์ Firebase
  • Safari < 10.1
  • iOS < 10.3
fetch
  • Authentication
  • Cloud Firestore
  • Cloud Functions
  • Performance Monitoring
  • Node < 18
fetch
  • Authentication
  • Cloud Firestore
  • Cloud Functions
  • Cloud Storage
  • React Native และ Expo
base-64
  • Cloud Storage

Polyfill ที่แนะนำ

Polyfill ใบอนุญาต
ES Stable MIT
fetch \- `cross-fetch` \- เหมาะที่สุดสำหรับเบราว์เซอร์เวอร์ชันเก่า MIT
fetch \- `undici` \- เหมาะที่สุดสำหรับ Node.js MIT
base-64 MIT

การตั้งค่า Polyfill ที่จำเป็นสำหรับ React Native และ Expo

สำหรับ React Native และ Expo หากคุณอัปโหลดสตริงที่เข้ารหัส base-64 คุณต้องทำดังนี้

ติดตั้ง base-64 จาก npm โดยใช้คำสั่งต่อไปนี้

npm install base-64

นำเข้า decode จาก base-64 และแนบไว้กับขอบเขตส่วนกลางเป็น atob เพื่อให้ Cloud Storage เข้าถึงได้

import { decode } from 'base-64';

if(typeof atob === 'undefined') {
  global.atob = decode;
}

เพิ่ม Polyfill ในแอปพลิเคชัน

ตัวเลือกที่ 1: (แนะนำ) ใช้ Bundler ที่ผสานรวมกับ Babel

หากใช้ Bundler ให้ผสานรวมกับ Babel และ @babel/preset-env เพื่อรับ Polyfill

ใช้คู่มือการตั้งค่าแบบอินเทอร์แอกทีฟของ Babel setup guide เพื่อดูวิธีผสานรวม Babel กับ Bundler

เมื่อใช้ Babel คุณไม่จำเป็นต้องกังวลเกี่ยวกับ Polyfill ที่ต้องรวม แต่คุณระบุสภาพแวดล้อมของเบราว์เซอร์ขั้นต่ำที่ต้องรองรับ จากนั้น Babel จะเพิ่ม Polyfill ที่จำเป็นให้คุณ Babel จะตรวจสอบว่าข้อกำหนดในการรองรับเบราว์เซอร์ของคุณเป็นไปตามที่กำหนดเสมอ แม้ว่า Firebase หรือโค้ดของคุณเองจะเริ่มใช้ฟีเจอร์ ES ใหม่ก็ตาม

@babel/preset-env มีข้อมูลโดยละเอียด เกี่ยวกับตัวเลือกการกำหนดค่าที่ใช้ได้สำหรับการระบุเป้าหมายสภาพแวดล้อม (ตัวเลือก targets) และการเพิ่ม Polyfill (ตัวเลือก useBuiltIns)

ตัวเลือกที่ 2: (ไม่แนะนำ) เพิ่ม Polyfill ด้วยตนเอง

คุณสามารถเพิ่ม Polyfill ด้วยตนเองโดยใช้ไลบรารี Polyfill ที่คุณชื่นชอบ (เช่น เช่น core-js)

import 'core-js/stable'
import 'cross-fetch/polyfill';

core-js ยังมีไฟล์ Polyfill แบบครบวงจร ที่คุณสามารถรวมไว้ในหน้า HTML ได้โดยตรง

ตัวเลือกนี้อาจเป็นวิธีที่สะดวกในการจัดการ Polyfill หากคุณไม่ได้ใช้ Babel อย่างไรก็ตาม เราไม่แนะนำตัวเลือกแบบครบวงจรนี้สำหรับแอป ที่ใช้งานจริง เนื่องจากมีแนวโน้มที่จะรวม Polyfill ที่ไม่จำเป็น ซึ่งจะเพิ่มขนาดหน้าเว็บ และทำให้เวลาในการโหลดหน้าเว็บนานขึ้น