แชร์แหล่งข้อมูลของโครงการในหลายเว็บไซต์

คุณสามารถสร้างเว็บไซต์ Firebase Hosting อย่างน้อย 1 เว็บไซต์ใน Firebase รายการเดียวได้ เนื่องจากเว็บไซต์ทั้งหมดอยู่ในโปรเจ็กต์ Firebase เดียวกัน เว็บไซต์ทั้งหมดจึงสามารถ เข้าถึงทรัพยากร Firebase อื่นๆ ของโปรเจ็กต์

การตั้งค่าเว็บไซต์ Hosting หลายรายการภายในโปรเจ็กต์ Firebase เดียวกันหมายความว่าคุณ สามารถแชร์ทรัพยากร Firebase ระหว่างเว็บไซต์และแอปที่เกี่ยวข้องได้ง่ายขึ้น สำหรับ ตัวอย่างเช่น ถ้าคุณตั้งค่าบล็อก แผงการดูแลระบบ และแอปสาธารณะในฐานะ ทั้งหมดภายในโครงการ Firebase เดียวกัน ทั้งหมดก็สามารถใช้ร่วมกันได้ Firebase Authentication ของฐานข้อมูล ขณะเดียวกันยังมีโดเมนเฉพาะของตนเอง หรือ เนื้อหา

ขั้นตอนที่ 1: อัปเดตเวอร์ชัน Firebase CLI

เข้าถึงฟีเจอร์ Firebase Hosting ล่าสุดภายในวันที่ การอัปเดต Firebase CLI เป็นเวอร์ชันล่าสุด

ขั้นตอนที่ 2: เพิ่มเว็บไซต์อื่นๆ

เพิ่มเว็บไซต์ลงในโปรเจ็กต์ Firebase โดยใช้วิธีใดวิธีหนึ่งต่อไปนี้

  • ใช้เวิร์กโฟลว์ใน Hosting หน้า ของคอนโซล Firebase

  • ใช้คำสั่ง Firebase CLI firebase hosting:sites:create SITE_ID

  • ใช้ Hosting REST API: projects.sites.create

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

  • SITE_ID.web.app
  • SITE_ID.firebaseapp.com

เนื่องจากมีการใช้ SITE_ID สำหรับ URL เหล่านี้ รหัสเว็บไซต์จึงมีข้อมูลต่อไปนี้ ข้อกำหนด

  • ต้องเป็นป้ายกำกับชื่อโฮสต์ที่ถูกต้อง หมายความว่าต้องไม่มี ., _ ฯลฯ
  • ต้องมีอักขระไม่เกิน 30 ตัว
  • ต้องไม่ซ้ำกันทั่วโลกภายใน Firebase

สำหรับแต่ละไซต์ คุณสามารถเลือก เพิ่มโดเมนที่กำหนดเองเพื่อแสดงเนื้อหาเดียวกันและ การกำหนดค่าให้กับ URL หลายรายการ

ลบเว็บไซต์รอง

ลบเว็บไซต์ที่ไม่ต้องการออกจากโปรเจ็กต์ Firebase โดยใช้รายการใดรายการหนึ่งต่อไปนี้ วิธีการ:

  • ใช้เวิร์กโฟลว์ใน Hosting หน้า ของคอนโซล Firebase

  • ใช้คำสั่ง Firebase CLI firebase hosting:sites:delete SITE_ID

  • ใช้ Hosting REST API: projects.sites.delete

โปรดทราบว่าคุณไม่สามารถลบเว็บไซต์เริ่มต้นซึ่งมี SITE_ID เหมือนกับ รหัสโปรเจ็กต์ Firebase

ขั้นตอนที่ 3: ตั้งค่าเป้าหมายการทำให้ใช้งานได้สำหรับเว็บไซต์

เมื่อคุณมีหลายเว็บไซต์และเรียกใช้คำสั่งทำให้ Firebase CLI ใช้งานได้ CLI ต้องการวิธีสื่อสารว่าการตั้งค่าใดควรนำไปใช้กับแต่ละรายการ ของคุณ เมื่อใช้เป้าหมายการติดตั้งใช้งาน คุณจะระบุได้โดยไม่ซ้ำกัน เว็บไซต์ที่ต้องการที่มี TARGET_NAME ใน ไฟล์การกำหนดค่า firebase.json และในFirebaseคำสั่ง CLI สำหรับ การทดสอบหรือการใช้งานในเว็บไซต์ของคุณ

หากต้องการสร้างเป้าหมายการทำให้ใช้งานได้และใช้ TARGET_NAME กับเว็บไซต์ Hosting ให้เรียกใช้ คำสั่ง CLI ต่อไปนี้จากรูทของไดเรกทอรีโปรเจ็กต์

firebase target:apply hosting TARGET_NAME RESOURCE_IDENTIFIER

โดยพารามิเตอร์มีดังนี้

  • TARGET_NAME — ชื่อที่ไม่ซ้ำกัน (ที่คุณกำหนดด้วยตนเอง) สำหรับฟิลด์ Hosting เว็บไซต์ที่กำลังทำให้ใช้งานได้

  • RESOURCE_IDENTIFIER — SITE_ID ของไซต์ Hosting เป็น แสดงอยู่ในโปรเจ็กต์ Firebase

เช่น หากคุณสร้างเว็บไซต์ 2 เว็บไซต์ (myapp-blog และ myapp-app) ใน โปรเจ็กต์ Firebase คุณสามารถใช้ TARGET_NAME (blog) ที่ไม่ซ้ำกัน และ app ตามลำดับ) ในแต่ละเว็บไซต์โดยเรียกใช้คำสั่งต่อไปนี้

firebase target:apply hosting blog myapp-blog
firebase target:apply hosting app myapp-app

การตั้งค่าสำหรับการปรับใช้เป้าหมายจะได้รับการจัดเก็บไว้ในไฟล์ .firebaserc ใน ไดเรกทอรีโครงการ ดังนั้นคุณจะต้องตั้งค่าเป้าหมายการทำให้ใช้งานได้เพียงครั้งเดียวต่อ

ขั้นตอนที่ 4: กำหนดการกำหนดค่าโฮสติ้งสำหรับแต่ละเว็บไซต์

ใช้ TARGET_NAME ที่ใช้ของเว็บไซต์เมื่อคุณกำหนดโฮสติ้งของเว็บไซต์ การกำหนดค่าใน firebase.json

  • หากไฟล์ firebase.json ระบุการกำหนดค่าสำหรับหลายเว็บไซต์ ใช้รูปแบบอาร์เรย์:

    {
  "hosting": [ {
      "target": "blog",  // "blog" is the applied TARGET_NAME for the Hosting site "myapp-blog"
      "public": "blog/dist",  // contents of this folder are deployed to the site "myapp-blog"

      // ...
    },
    {
      "target": "app",  // "app" is the applied TARGET_NAME for the Hosting site "myapp-app"
      "public": "app/dist",  // contents of this folder are deployed to the site "myapp-app"

      // ...

      "rewrites": [...]  // You can define specific Hosting configurations for each site
    }
  ]
}

  • หากไฟล์ firebase.json มีการกำหนดค่าสำหรับเว็บไซต์เพียงเว็บไซต์เดียว คุณไม่จำเป็นต้องใช้รูปแบบอาร์เรย์:

    {
  "hosting": {
      "target": "blog",
      "public": "dist",

      // ...

      "rewrites": [...]
  }
}

ขั้นตอนที่ 5: ทดสอบในเครื่อง ดูตัวอย่างการเปลี่ยนแปลง และทำให้ใช้งานได้กับเว็บไซต์ของคุณ

เรียกใช้คำสั่งต่อไปนี้จากรูทของไดเรกทอรีโปรเจ็กต์ในเครื่อง

คำสั่ง คำอธิบาย
firebase emulators:start --only hosting จำลองเนื้อหา Hosting และการกำหนดค่าของ เริ่มต้น เว็บไซต์ Hosting ที่โฮสต์ในเครื่อง URL
firebase emulators:start --only hosting:TARGET_NAME จำลองเนื้อหา Hosting และการกำหนดค่าของที่ระบุ เว็บไซต์ Hosting รายการที่ URL ที่โฮสต์ในเครื่อง
firebase hosting:channel:deploy \
CHANNEL_ID		 ทำให้เนื้อหาและการกำหนดค่า Hosting ใช้งานได้ เว็บไซต์ Hosting เริ่มต้น ที่ URL ตัวอย่าง
firebase hosting:channel:deploy \
CHANNEL_ID --only TARGET_NAME		 ทำให้เนื้อหาและการกำหนดค่าของ Hosting ที่ระบุใช้งานได้ เว็บไซต์ Hosting ที่ URL ตัวอย่าง
firebase deploy --only hosting นำเนื้อหาและการกำหนดค่าของ Hosting ไปใช้กับช่องถ่ายทอดสด จากเว็บไซต์ ทั้งหมด Hosting ที่กำหนดค่าใน firebase.json
firebase deploy --only hosting:TARGET_NAME นำเนื้อหาและการกำหนดค่าของ Hosting ไปใช้กับช่องถ่ายทอดสด ของเว็บไซต์ Hosting ที่ระบุ
คำสั่ง คำอธิบาย
(ไม่แนะนำ ใช้ emulators:start แทน)
firebase serve --only hosting 		แสดงเนื้อหา Hosting และการกำหนดค่าของ เริ่มต้น เว็บไซต์ Hosting ที่โฮสต์ในเครื่อง URL
(ไม่แนะนำ ใช้ emulators:start แทน)
firebase serve --only hosting:TARGET_NAME 		แสดงเนื้อหา Hosting และการกำหนดค่าของที่ระบุ เว็บไซต์ Hosting รายการที่ URL ที่โฮสต์ในเครื่อง