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

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

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

สำคัญ: คุณยังคงต้องรวม Polyfill สำหรับสภาพแวดล้อมที่ไม่รองรับฟีเจอร์ที่ Firebase ต้องการ

เบราว์เซอร์

ผลิตภัณฑ์ Firebase	Edge	Firefox	Chrome	iOS Safari	Safari
Firebase AI Logic ^1
Analytics
App Check
Authentication
Cloud Firestore	(ยกเว้น ความต่อเนื่อง)			(ยกเว้น ความคงอยู่ หาก iOS < 10)
Cloud Functions
Cloud Messaging	(Edge 17+ ยกเว้นอุปกรณ์เคลื่อนที่)
Cloud Storage
มีการติดตั้งไปแล้ว Firebase ครั้ง
Performance Monitoring
Realtime Database
Remote Config
SQL Connect

^{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
Cloud Messaging
Cloud Storage	(ยกเว้น การอัปโหลด)
มีการติดตั้งไปแล้ว Firebase ครั้ง
Performance Monitoring
Realtime Database
Remote Config
SQL Connect

^{1 Firebase AI Logic เดิมเรียกว่า "Vertex AI in Firebase"}

หมายเหตุ: ระบบรองรับฟีเจอร์ Authentication ทั้งหมด ยกเว้นการตรวจสอบสิทธิ์ทางโทรศัพท์และการดำเนินการ OAuth แบบป๊อปอัป/เปลี่ยนเส้นทาง

Polyfill

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

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

Polyfill ที่จำเป็น

สภาพแวดล้อม
Safari 7, 8 และ 9	ES เวอร์ชันเสถียร
โหนด < 10	ES เวอร์ชันเสถียร

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

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

Polyfill ที่แนะนำ

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

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

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

ติดตั้ง 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 เพื่อดูวิธีผสานรวม Babel กับ Bundler

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

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

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

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

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

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

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

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