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

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

• แต่ละเว็บไซต์มีการกำหนดค่า Hosting ของตัวเอง
• แต่ละเว็บไซต์โฮสต์คอลเล็กชันเนื้อหาของตัวเอง
• แต่ละเว็บไซต์มีโดเมนที่เชื่อมโยงอย่างน้อย 1 โดเมนได้

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

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

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

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

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

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

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

• ใช้ 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 และ Serverless > Hosting ของคอนโซลFirebase

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

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

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

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

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

หากต้องการสร้างเป้าหมายการทำให้ใช้งานได้และใช้ 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: กำหนดการกำหนดค่า Hosting สำหรับแต่ละเว็บไซต์

ใช้ TARGET_NAME ที่ใช้กับเว็บไซต์เมื่อกำหนดการกำหนดค่า Hosting ในไฟล์ 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: ทดสอบในเครื่อง แสดงตัวอย่างการเปลี่ยนแปลง และทำให้เว็บไซต์ใช้งานได้

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