Firebase Hosting เป็นวิธีที่รวดเร็ว ปลอดภัย และเชื่อถือได้ในการโฮสต์ชิ้นงานแบบคงที่ของแอป (HTML, CSS, JavaScript, ไฟล์สื่อ ฯลฯ) รวมถึงแสดงเนื้อหาแบบไดนามิกและโฮสต์ไมโครเซอร์วิส
โฮสติ้งระดับเวอร์ชันที่ใช้งานจริงของเราได้รับการสนับสนุนจากเครือข่ายนำส่งข้อมูล (CDN) ทั่วโลก Hosting จะแสดงเนื้อหาผ่าน SSL โดยค่าเริ่มต้น และสามารถใช้กับโดเมนที่กำหนดเองหรือโดเมนย่อยของโปรเจ็กต์ได้โดยไม่มีค่าใช้จ่ายใน web.app
และ firebaseapp.com
ก่อนเริ่มต้น
คุณต้องสร้างโปรเจ็กต์ Firebase ก่อนจึงจะตั้งค่า Firebase Hosting ได้
ขั้นตอนที่ 1: ติดตั้ง Firebase CLI
ไปที่Firebaseเอกสารประกอบของ CLI เพื่อดูวิธีติดตั้ง CLI หรืออัปเดตเป็นเวอร์ชันล่าสุด
ขั้นตอนที่ 2: เริ่มต้นโปรเจ็กต์
หากต้องการเชื่อมต่อไฟล์โปรเจ็กต์ในเครื่องกับโปรเจ็กต์ Firebase ให้เรียกใช้คำสั่งต่อไปนี้จากรูทของไดเรกทอรีโปรเจ็กต์ในเครื่อง
firebase init hosting
ในระหว่างการเริ่มต้นโปรเจ็กต์ ให้ทำดังนี้จากพรอมต์ Firebase CLI
เลือกโปรเจ็กต์ Firebase เพื่อเชื่อมต่อกับไดเรกทอรีโปรเจ็กต์ในเครื่อง
โปรเจ็กต์ Firebase ที่เลือกจะเป็นโปรเจ็กต์ Firebase "เริ่มต้น" สำหรับไดเรกทอรีโปรเจ็กต์ในเครื่อง หากต้องการเชื่อมต่อโปรเจ็กต์ Firebase เพิ่มเติมกับไดเรกทอรีโปรเจ็กต์ในเครื่อง ให้ตั้งค่าอีเมลแทนโปรเจ็กต์
ระบุไดเรกทอรีที่จะใช้เป็นไดเรกทอรีรูทสาธารณะ
ไดเรกทอรีนี้มีไฟล์คงที่ที่แสดงต่อสาธารณะทั้งหมด รวมถึงไฟล์
index.html
ของคุณและชิ้นงานอื่นๆ ที่ต้องการนำไปติดตั้งใช้งานใน Firebase Hostingค่าเริ่มต้นของไดเรกทอรีรูทสาธารณะเรียกว่า
public
คุณสามารถระบุไดเรกทอรีรูทสาธารณะตอนนี้หรือระบุในภายหลังในไฟล์การกําหนดค่า
firebase.json
ก็ได้หากคุณเลือกค่าเริ่มต้นและยังไม่มีไดเรกทอรีชื่อ
public
Firebase จะสร้างไดเรกทอรีนั้นให้คุณ
หากคุณยังไม่มีไฟล์
index.html
หรือไฟล์404.html
ที่ถูกต้องในไดเรกทอรีรูทสาธารณะ Firebase จะสร้างไฟล์เหล่านั้นให้คุณ
เลือกการกําหนดค่าสําหรับเว็บไซต์
หากเลือกสร้างแอปแบบหน้าเดียว Firebase จะเพิ่มการกําหนดค่าการเขียนใหม่ให้คุณโดยอัตโนมัติ
เมื่อการเริ่มต้นเสร็จสิ้น Firebase จะสร้างและเพิ่มไฟล์ 2 ไฟล์ต่อไปนี้ลงในรูทของไดเรกทอรีแอปในเครื่องโดยอัตโนมัติ
ไฟล์การกำหนดค่า
firebase.json
ที่แสดงการกำหนดค่าโปรเจ็กต์ ดูข้อมูลเพิ่มเติมเกี่ยวกับไฟล์นี้ในหน้ากำหนดค่าลักษณะการโฮสต์ไฟล์
.firebaserc
ที่เก็บอีเมลแทนของโปรเจ็กต์
ขั้นตอนที่ 3: ติดตั้งใช้งานในเว็บไซต์
หากต้องการทำให้ใช้งานได้ในเว็บไซต์ ให้เรียกใช้คำสั่งต่อไปนี้จากรูทของไดเรกทอรีโครงการในเครื่อง
firebase deploy --only hosting
คำสั่งนี้จะติดตั้งใช้งานเนื้อหาและการกำหนดค่า Hosting ไปยังโดเมนย่อยที่ Firebase จัดสรรไว้ต่อไปนี้
PROJECT_ID.web.app
PROJECT_ID.firebaseapp.com
ดูข้อมูลเพิ่มเติมเกี่ยวกับการติดตั้งใช้งานและแม้กระทั่งการทดสอบเว็บไซต์ในเครื่อง
ขั้นตอนถัดไป
ตอนนี้เว็บไซต์ของคุณพร้อมที่จะแชร์กับโลกแล้ว
ปรับปรุงเว็บไซต์ต่อไป ทดสอบในเครื่อง แชร์การเปลี่ยนแปลงที่ URL ตัวอย่างชั่วคราว จากนั้นจึงนำไปใช้งานในเว็บไซต์จริง ทำตามคำแนะนำทีละขั้นตอนนี้
ดูข้อมูลเกี่ยวกับความสามารถด้านการโฮสต์เพิ่มเติม
ดูเอกสารประกอบฉบับเต็มของ Firebase CLI
เตรียมเปิดตัวแอป
- ตั้งค่าการแจ้งเตือนเกี่ยวกับงบประมาณสำหรับโปรเจ็กต์ในคอนโซล Google Cloud
- ตรวจสอบแดชบอร์ดการใช้งานและการเรียกเก็บเงินในคอนโซล Firebase เพื่อดูภาพรวมการใช้งานโปรเจ็กต์ในบริการ Firebase หลายรายการ นอกจากนี้ คุณยังไปที่Hosting แดชบอร์ดการใช้งานเพื่อดูข้อมูลการใช้งานโดยละเอียดได้อีกด้วย
- ตรวจสอบรายการตรวจสอบการเปิดตัว Firebase