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

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

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

เบราว์เซอร์

ผลิตภัณฑ์ Firebase	Edge	Firefox	Chrome	Safari บน iOS	Safari
การตรวจสอบแอป
ข้อมูลวิเคราะห์
การตรวจสอบสิทธิ์
Cloud Firestore	(ยกเว้น ความต่อเนื่อง)			(ยกเว้น ความต่อเนื่อง หาก iOS < 10)
ฟังก์ชันระบบคลาวด์
การติดตั้ง Firebase
การรับส่งข้อความในระบบคลาวด์	(Edge 17+ ยกเว้นอุปกรณ์เคลื่อนที่)
พื้นที่เก็บข้อมูลระบบคลาวด์
การตรวจสอบประสิทธิภาพ
ฐานข้อมูลเรียลไทม์
การกำหนดค่าระยะไกล
Vertex AI สำหรับ Firebase

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

ผลิตภัณฑ์ Firebase	รีแอ็กชันเนทีฟ	Node.js	ส่วนขยาย Chrome	คอร์โดวา
การตรวจสอบแอป	(การใช้ผู้ให้บริการที่กำหนดเองเพื่อสร้างเอกสารรับรองอุปกรณ์เนทีฟ)	(ใช้ผู้ให้บริการที่กำหนดเอง)
ข้อมูลวิเคราะห์
การตรวจสอบสิทธิ์	(ดูหมายเหตุ)	(ดูหมายเหตุ)	(ดูหมายเหตุ)	(ดูหมายเหตุ)
Cloud Firestore	(ยกเว้น ความต่อเนื่อง)	(ยกเว้น ความต่อเนื่อง)
ฟังก์ชันระบบคลาวด์
การติดตั้ง Firebase
การรับส่งข้อความในระบบคลาวด์
พื้นที่เก็บข้อมูลระบบคลาวด์	(ยกเว้น การอัปโหลด)
การตรวจสอบประสิทธิภาพ
ฐานข้อมูลเรียลไทม์
การกำหนดค่าระยะไกล
Vertex AI สำหรับ Firebase

โพลีฟิล

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

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

โพลีฟิลล์ที่จำเป็น

สภาพแวดล้อม	โพลีฟิลล์
Safari 7 และ 8 และ 9	เสถียรสเปน
โหนด < 6.5	เสถียรสเปน

โพลีฟิลล์ที่ไม่บังคับ

สภาพแวดล้อม	โพลีฟิลล์	ผลิตภัณฑ์ Firebase
โหนด Safari < 10.1 iOS < 10.3	ดึงข้อมูล	Cloud Functions Performance Monitoring
รีแอ็กกับโฆษณาเนทีฟและเอ็กซ์โป	ฐาน 64	Cloud Storage

โพลีฟิลล์ที่แนะนำ

โพลีฟิลล์	ใบอนุญาต
เสถียรแบบสเปน	MIT
ดึงข้อมูล	MIT
ฐาน 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 คุณไม่ต้องกังวลเรื่องโพลีฟิลที่ต้องรวมไว้ แต่คุณจะระบุสภาพแวดล้อมของเบราว์เซอร์ขั้นต่ำที่คุณต้องการรองรับแทน จากนั้น Babel จะเพิ่มโพลีฟิลที่จำเป็นสำหรับคุณ 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 ได้โดยตรง

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