กำหนดค่าพฤติกรรมการโฮสต์

ด้วย Firebase Hosting คุณสามารถกำหนดค่าพฤติกรรมการโฮสต์แบบกำหนดเองสำหรับคำขอที่ส่งมายังไซต์ของคุณได้

คุณสามารถกำหนดค่าอะไรสำหรับโฮสติ้ง?

• ระบุไฟล์ในไดเร็กทอรีโปรเจ็กต์ในเครื่องที่คุณต้องการปรับใช้กับ Firebase Hosting เรียนรู้วิธีการ

• แสดงหน้า 404/ไม่พบที่กำหนดเอง เรียนรู้วิธีการ

• ตั้งค่า redirects สำหรับหน้าเว็บที่คุณได้ย้ายหรือลบ เรียนรู้วิธีการ

• ตั้งค่าการ rewrites ใด ๆ ของวัตถุประสงค์เหล่านี้:

  • แสดงเนื้อหาเดียวกันสำหรับ URL หลายรายการ เรียนรู้วิธีการ

  • ให้บริการฟังก์ชันหรือเข้าถึงคอนเทนเนอร์ Cloud Run จาก Hosting URL เรียนรู้วิธีการ: ฟังก์ชั่น หรือ ภาชนะ

  • สร้างไดนามิกลิงก์โดเมนที่กำหนดเอง เรียนรู้วิธีการ

• เพิ่ม headers ที่จะผ่านพร้อมข้อมูลเพิ่มเติมเกี่ยวกับการร้องขอหรือการตอบสนองเช่นวิธีเบราว์เซอร์ควรจะจัดการกับหน้าและเนื้อหาของมัน (การตรวจสอบแคช, การเข้ารหัส, ฯลฯ ) เรียนรู้วิธีการ

• ตั้งค่าการทำให้เป็นสากล (i18n) การเขียนใหม่เพื่อแสดงเนื้อหาเฉพาะตามการตั้งค่าภาษาของผู้ใช้และ/หรือประเทศ เรียนรู้วิธีการ (หน้าแตกต่างกัน)

คุณกำหนดการกำหนดค่าโฮสติ้งของคุณไว้ที่ใด

คุณกำหนด Firebase กำหนดค่าของคุณโฮสติ้งในของคุณ firebase.json ไฟล์ Firebase จะสร้างคุณ firebase.json ไฟล์ที่รากของไดเรกทอรีโครงการของคุณเมื่อคุณเรียกใช้ firebase init คำสั่ง

คุณสามารถค้นหา เต็ม firebase.json ตัวอย่างเช่นการกำหนดค่า (ครอบคลุมเพียง Firebase โฮสติ้ง) ที่ด้านล่างของหน้านี้ หมายเหตุว่า firebase.json ไฟล์ยังสามารถมี การกำหนดค่าสำหรับการให้บริการ Firebase อื่น ๆ

คุณสามารถตรวจสอบการใช้งาน firebase.json เนื้อหาโดยใช้ REST API โฮสติ้ง

ลำดับความสำคัญของการตอบกลับของ Hosting

ตัวเลือกการกำหนดค่า Firebase Hosting ต่างๆ ที่อธิบายไว้ในหน้านี้บางครั้งอาจทับซ้อนกัน หากมีข้อขัดแย้ง Hosting จะกำหนดการตอบสนองโดยใช้ลำดับความสำคัญต่อไปนี้:

1. namespaces ลิขสิทธิ์ที่เริ่มต้นด้วย /__/* ส่วนของเส้นทาง
2. การกำหนดค่า การเปลี่ยนเส้นทาง
3. เนื้อหาคงที่ตรงทั้งหมด
4. การกำหนดค่า ปรับเปลี่ยน
5. ที่กำหนดเอง 404 หน้า
6. หน้า 404 เริ่มต้น

หากคุณกำลังใช้ ปรับเปลี่ยน i18n ที่ตรงกันและ 404 ตามลำดับความสำคัญในการจัดการมีการขยายตัวอยู่ในขอบเขตที่จะรองรับ "เนื้อหา i18n ของคุณ"

ระบุไฟล์ที่จะปรับใช้

คุณลักษณะเริ่มต้น - public และ ignore - รวมอยู่ในค่าเริ่มต้น firebase.json ไฟล์กำหนดไฟล์ในไดเรกทอรีโครงการของคุณควรจะนำไปใช้กับโครงการ Firebase ของคุณ

เริ่มต้น hosting การกำหนดค่าใน firebase.json ไฟล์ลักษณะเช่นนี้

"hosting": {
  "public": "public",  // the only required attribute for Hosting
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ]
}

สาธารณะ

ที่จำเป็น
public ระบุแอตทริบิวต์ที่ไดเรกทอรีที่จะปรับใช้เพื่อ Firebase โฮสติ้ง ค่าเริ่มต้นคือไดเรกทอรีชื่อ public แต่คุณสามารถระบุเส้นทางไดเรกทอรีใด ๆ ตราบใดที่มันมีอยู่ในไดเรกทอรีโครงการของคุณ

ต่อไปนี้เป็นชื่อเริ่มต้นที่ระบุของไดเร็กทอรีที่จะปรับใช้:

"hosting": {
  "public": "public"

  // ...
}

คุณสามารถเปลี่ยนค่าเริ่มต้นเป็นไดเร็กทอรีที่คุณต้องการปรับใช้:

"hosting": {
  "public": "dist/app"

  // ...
}

ไม่สนใจ

ไม่จำเป็น
ignore แอตทริบิวต์ระบุไฟล์ที่จะไม่สนใจในการปรับใช้ มันสามารถใช้เวลา globs ทางเดียวกันว่า Git จับ .gitignore

ต่อไปนี้เป็นค่าเริ่มต้นสำหรับไฟล์ที่จะละเว้น:

"hosting": {
  // ...

  "ignore": [
    "firebase.json",  // the Firebase configuration file (the file described on this page)
    "**/.*",  // files with a leading period should be hidden from the system
    "**/node_modules/**"  // contains dependencies used to create your site but not run it
  ]
}

ปรับแต่งหน้า 404/ไม่พบ

ไม่จำเป็น
คุณสามารถให้บริการที่กำหนดเอง 404 Not Found ข้อผิดพลาดเมื่อผู้ใช้พยายามที่จะเข้าถึงหน้าเว็บที่ไม่ได้อยู่

สร้างไฟล์ใหม่ในโครงการของคุณของ public ไดเรกทอรี ชื่อมัน 404.html แล้วเพิ่มของคุณเอง 404 Not Found เนื้อหาไปยังแฟ้ม

Firebase Hosting จะแสดงเนื้อหาที่กำหนดเองนี้ 404.html หน้าหากเบราว์เซอร์เรียก 404 Not Found ข้อผิดพลาดในโดเมนหรือโดเมนย่อยของคุณ

กำหนดค่าการเปลี่ยนเส้นทาง

ไม่จำเป็น
ใช้การเปลี่ยนเส้นทาง URL เพื่อป้องกันลิงก์เสีย หากคุณย้ายหน้าหรือย่อ URL ตัวอย่างเช่นคุณสามารถเปลี่ยนเส้นทางเบราว์เซอร์จาก example.com/team เพื่อ example.com/about.html

ระบุการเปลี่ยนเส้นทาง URL โดยการสร้าง redirects แอตทริบิวต์ที่มีอาร์เรย์ของวัตถุ (เรียกว่า "กฎการเปลี่ยนเส้นทาง") ในแต่ละกฎ ระบุรูปแบบ URL ที่หากตรงกับเส้นทาง URL คำขอ จะเรียก Hosting ให้ตอบสนองด้วยการเปลี่ยนเส้นทางไปยัง URL ปลายทางที่ระบุ

นี่คือโครงสร้างพื้นฐานสำหรับ redirects แอตทริบิวต์ ตัวอย่างนี้เปลี่ยนเส้นทางการร้องขอไปยัง /foo โดยการทำคำขอใหม่เพื่อ /bar

"hosting": {
  // ...

  // Returns a permanent redirect to "/bar" for requests to "/foo" (but not "/foo/**")
  "redirects": [ {
    "source": "/foo",
    "destination": "/bar",
    "type": 301
  } ]
}

"hosting": {
  // ...

  // Add the "redirects" attribute within "hosting"
  "redirects": [ {
    // Returns a permanent redirect to "/bar" for requests to "/foo" (but not "/foo/**")
    "source": "/foo",
    "destination": "/bar",
    "type": 301
  }, {
    // Returns a permanent redirect to "/bar" for requests to both "/foo" and "/foo/**"
    "source": "/foo{,/**}"
    "destination": "/bar"
    "type": 301
  }, {
    // Returns a temporary redirect for all requests to files or directories in the "firebase" directory
    "source": "/firebase/**",
    "destination": "https://firebase.google.com/",
    "type": 302
  }, {
    // A regular expression-based redirect equivalent to the above behavior
    "regex": "/firebase/.*",
    "destination": "https://firebase.google.com/",
    "type": 302
  } ]
}

redirects แอตทริบิวต์มีอาร์เรย์ของกฎการเปลี่ยนเส้นทางโดยที่แต่ละกฎจะต้องมีเขตข้อมูลในตารางด้านล่าง

Firebase Hosting เปรียบเทียบ source หรือ regex คุ้มค่ากับเส้นทาง URL ทั้งหมดที่เริ่มต้นของทุกคำขอ (ก่อนเบราว์เซอร์จะกำหนดว่าไฟล์หรือโฟลเดอร์ที่มีอยู่ในเส้นทางนั้น) ถ้าการแข่งขันถูกพบแล้วเซิร์ฟเวอร์กำเนิด Hosting Firebase ส่งการตอบสนอง HTTPS เปลี่ยนเส้นทางบอกเบราว์เซอร์ที่จะทำให้คำขอใหม่ที่ destination URL

จับกลุ่ม URL สำหรับการเปลี่ยนเส้นทาง

ไม่จำเป็น
บางครั้งคุณอาจต้องกลุ่มเฉพาะการจับภาพของรูปแบบ URL กฎการเปลี่ยนเส้นทาง ( source หรือ regex ค่า) แล้วกลับมาใช้กลุ่มเหล่านี้ในกฎของ destination เส้นทาง

"hosting": {
  // ...

  "redirects": [ {
    "source": "/blog/:post*",  // captures the entire URL segment beginning at "post"
    "destination": "https://blog.myapp.com/:post", // includes the entire URL segment identified and captured by the "source" value
    "type": 301
  }, {
    "source": "/users/:id/profile",  // captures only the URL segment "id", but nothing following
    "destination": "/users/:id/newProfile",  // includes the URL segment identified and captured by the "source" value
    "type": 301
  } ]
}

"hosting": {
  // ...

  "redirects": [ {
    "regex": "/blog/(?P<post>.+)",  // if you're familiar with PCRE, be aware that RE2 requires named capture groups to begin with ?P
    "destination": "https://blog.myapp.com/:post",  // includes the entire URL segment identified and captured by the `regex` value
    "type": 301
  }, {
    "regex": "/users/(\d+)/profile",  // uses the \d directive to only match numerical path segments
    "destination": "/users/:1/newProfile",  // the first capture group to be seen in the `regex` value is named 1, and so on
    "type": 301
  } ]
}

กำหนดค่าการเขียนใหม่

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

นอกจากนี้คุณยังสามารถใช้ปรับเปลี่ยนเพื่อสนับสนุนการปพลิเคชันที่ใช้ HTML5 pushState สำหรับการนำทาง เมื่อมีความพยายามในการเบราว์เซอร์ที่จะเปิดเส้นทาง URL ที่ตรงกับที่ระบุ source หรือ regex รูปแบบ URL เบราว์เซอร์จะได้รับเนื้อหาของแฟ้มที่ destination URL แทน

ระบุ URL เขียนใหม่โดยการสร้าง rewrites แอตทริบิวต์ที่มีอาร์เรย์ของวัตถุ (เรียกว่า "เขียนกฎ") ในแต่ละกฎ ให้ระบุรูปแบบ URL ที่หากตรงกับเส้นทาง URL คำขอ จะทริกเกอร์ Hosting ให้ตอบสนองราวกับว่าบริการได้รับ URL ปลายทางที่ระบุ

นี่คือโครงสร้างพื้นฐานสำหรับ rewrites แอตทริบิวต์ ตัวอย่างนี้ให้บริการอาหาร index.html สำหรับการร้องขอไปยังไฟล์หรือไดเรกทอรีที่ไม่อยู่

"hosting": {
  // ...

  // Serves index.html for requests to files or directories that do not exist
  "rewrites": [ {
    "source": "**",
    "destination": "/index.html"
  } ]
}

"hosting": {
// ...

// Add the "rewrites" attribute within "hosting"
"rewrites": [ {
  // Serves index.html for requests to files or directories that do not exist
  "source": "**",
  "destination": "/index.html"
}, {
  // Serves index.html for requests to both "/foo" and "/foo/**"
  // Using "/foo/**" only matches paths like "/foo/xyz", but not "/foo"
  "source": "/foo{,/**}",
  "destination": "/index.html"
}, {
  // A regular expression-based rewrite equivalent to the above behavior
  "regex": "/foo(/.*)?",
  "destination": "/index.html"
}, {
  // Excludes specified pathways from rewrites
  "source": "!/@(js|css)/**",
  "destination": "/index.html"
} ]
}

rewrites แอตทริบิวต์มีอาร์เรย์ของกฎการเขียนซ้ำโดยที่แต่ละกฎจะต้องมีเขตข้อมูลในตารางด้านล่าง

Firebase Hosting ใช้เฉพาะเขียนกฎถ้าแฟ้มหรือไดเรกทอรีไม่ได้อยู่ในเส้นทาง URL ที่ตรงกับที่ระบุ source หรือ regex รูปแบบ URL เมื่อมีการร้องขอทริกเกอร์เขียนกฎให้ผลตอบแทนที่เบราว์เซอร์เนื้อหาจริงของที่ระบุ destination ไฟล์แทนการเปลี่ยนเส้นทาง HTTP

คำขอโดยตรงไปยังฟังก์ชัน

คุณสามารถใช้ rewrites การให้บริการฟังก์ชั่นจาก URL Firebase โฮสติ้ง ตัวอย่างต่อไปนี้คือข้อความที่ตัดตอนมาจาก การให้บริการเนื้อหาแบบไดนามิกโดยใช้ฟังก์ชั่นคลาวด์

ตัวอย่างเช่นการร้องขอทั้งหมดโดยตรงจากหน้าเว็บ /bigben บนเว็บไซต์โฮสติ้งของคุณเพื่อดำเนินการ bigben ฟังก์ชั่น:

"hosting": {
  // ...

  // Directs all requests from the page `/bigben` to execute the `bigben` function
  "rewrites": [ {
    "source": "/bigben",
    "function": "bigben"
  } ]
}

หลังจากเพิ่มเขียนกฎนี้และนำไปใช้กับ Firebase (โดยใช้ firebase deploy ) ฟังก์ชั่นของคุณสามารถเข้าถึงได้ผ่านทาง URL ต่อไปนี้:

• โดเมนย่อย Firebase ของคุณ:
  PROJECT_ID .web.app/bigben และ PROJECT_ID .firebaseapp.com/bigben

• ที่เชื่อมต่อ โดเมนที่กำหนดเอง :
  CUSTOM_DOMAIN /bigben

เมื่อเปลี่ยนเส้นทางการร้องขอไปยังฟังก์ชั่นกับโฮสติ้ง, การสนับสนุนวิธีการร้องขอ HTTP มี GET , POST , HEAD , PUT , DELETE , PATCH และ OPTIONS วิธีการอื่น ๆ เช่น REPORT หรือ PROFIND ยังไม่ได้รับการสนับสนุน

ส่งคำขอโดยตรงไปยังคอนเทนเนอร์ Cloud Run

คุณสามารถใช้ rewrites การเข้าถึงภาชนะเมฆเรียกใช้จาก URL ที่ Firebase โฮสติ้ง ตัวอย่างต่อไปนี้คือข้อความที่ตัดตอนมาจาก การให้บริการเนื้อหาแบบไดนามิกโดยใช้ระบบคลาวด์ Run

ตัวอย่างเช่นการร้องขอทั้งหมดโดยตรงจากหน้า /helloworld บนเว็บไซต์โฮสติ้งของคุณเพื่อเรียกเริ่มต้นและการทำงานของ helloworld เช่นภาชนะ:

"hosting": {
 // ...

 // Directs all requests from the page `/helloworld` to trigger and run a `helloworld` container
 "rewrites": [ {
   "source": "/helloworld",
   "run": {
     "serviceId": "helloworld",  // "service name" (from when you deployed the container image)
     "region": "us-central1"  // optional (if omitted, default is us-central1)
   }
 } ]
}

หลังจากเพิ่มเขียนกฎนี้และนำไปใช้กับ Firebase (โดยใช้ firebase deploy ) ภาพคอนเทนเนอร์ของคุณสามารถเข้าถึงได้ผ่านทาง URL ต่อไปนี้:

• โดเมนย่อย Firebase ของคุณ:
  PROJECT_ID .web.app/helloworld และ PROJECT_ID .firebaseapp.com/helloworld

• ที่เชื่อมต่อ โดเมนที่กำหนดเอง :
  CUSTOM_DOMAIN /helloworld

เมื่อเปลี่ยนเส้นทางการร้องขอไปยังภาชนะเมฆเรียกใช้กับโฮสติ้ง, การสนับสนุนวิธีการร้องขอ HTTP มี GET , POST , HEAD , PUT , DELETE , PATCH และ OPTIONS วิธีการอื่น ๆ เช่น REPORT หรือ PROFIND ยังไม่ได้รับการสนับสนุน

ปัจจุบัน คุณสามารถใช้ Cloud Run ใหม่กับโฮสติ้งได้ในภูมิภาคต่อไปนี้:

• asia-east1
• asia-east2
• asia-northeast1
• asia-northeast2
• asia-northeast3
• asia-south1
• asia-southeast1
• asia-southeast2
• australia-southeast1
• europe-north1
• europe-west1
• europe-west2
• europe-west3
• europe-west4
• europe-west6
• northamerica-northeast1
• southamerica-east1
• us-central1
• us-east1
• us-east4
• us-west1

สร้างโดเมนที่กำหนดเอง Dynamic Links

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

• ใช้โดเมนที่กำหนดเองของคุณเพียง แต่สำหรับแบบไดนามิกลิงค์

  "hosting": {
    // ...
  
    "appAssociation": "AUTO",  // required for Dynamic Links (default is AUTO if not specified)
  
    // Add the "rewrites" attribute within "hosting"
    "rewrites": [ {
      "source": "/**",  // the Dynamic Links start with "https://CUSTOM_DOMAIN/"
      "dynamicLinks": true
    } ]
  }
  

• ระบุคำนำหน้าเส้นทางโดเมนที่กำหนดเองเพื่อใช้สำหรับ Dynamic Links

  "hosting": {
    // ...
  
    "appAssociation": "AUTO",  // required for Dynamic Links (default is AUTO if not specified)
  
    // Add the "rewrites" attribute within "hosting"
    "rewrites": [ {
      "source": "/promos/**",  // the Dynamic Links start with "https://CUSTOM_DOMAIN/promos/"
      "dynamicLinks": true
    }, {
      "source": "/links/share/**",  // the Dynamic Links start with "https://CUSTOM_DOMAIN/links/share/"
      "dynamicLinks": true
    } ]
  }
  

การกำหนดค่าแบบไดนามิกการเชื่อมโยงในของคุณ firebase.json ไฟล์ต้องมีต่อไปนี้:

กำหนดค่าส่วนหัว

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

ระบุที่กำหนดเองส่วนหัวของการตอบสนองไฟล์เฉพาะโดยการสร้าง headers แอตทริบิวต์ที่มีอาร์เรย์ของวัตถุส่วนหัว ในแต่ละอ็อบเจ็กต์ ระบุรูปแบบ URL ที่หากตรงกับเส้นทาง URL คำขอ โฮสต์จะใช้ส่วนหัวการตอบสนองที่กำหนดเองที่ระบุ

นี่คือโครงสร้างพื้นฐานสำหรับ headers แอตทริบิวต์ ตัวอย่างนี้ใช้ส่วนหัว CORS สำหรับไฟล์ฟอนต์ทั้งหมด

"hosting": {
  // ...

  // Applies a CORS header for all font files
  "headers": [ {
    "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
    "headers": [ {
      "key": "Access-Control-Allow-Origin",
      "value": "*"
    } ]
  } ]
}

"hosting": {
  // ...

  // Add the "headers" attribute within "hosting"
  "headers": [ {
    // Applies a CORS header for all font files
    "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
    "headers": [ {
      "key": "Access-Control-Allow-Origin",
      "value": "*"
    } ]
  }, {
    // Overrides the default 1 hour browser cache with a 2 hour cache for all image files
    "source": "**/*.@(jpg|jpeg|gif|png)",
    "headers": [ {
      "key": "Cache-Control",
      "value": "max-age=7200"
    } ]
  }, {
    // A regular expression-based rewrite equivalent to the above behavior
    "regex": ".+/\w+\.(jpg|jpeg|gif|png)$",
    "headers": [ {
      "key": "Cache-Control",
      "value": "max-age=7200"
    } ]
  }, {
    // Sets the cache header for 404 pages to cache for 5 minutes
    "source": "404.html",
    "headers": [ {
      "key": "Cache-Control",
      "value": "max-age=300"
    } ]
  } ]
}

headers แอตทริบิวต์มีอาร์เรย์ของคำจำกัดความโดยที่แต่ละคนจะต้องมีความหมายเขตข้อมูลในตารางด้านล่าง

คุณสามารถเรียนรู้เพิ่มเติมเกี่ยวกับการ Cache-Control ในส่วนของโฮสติ้งที่อธิบายเนื้อหาแบบไดนามิกที่ให้บริการโฮสติ้งและ microservices นอกจากนี้คุณยังสามารถเรียนรู้เพิ่มเติมเกี่ยวกับ ล ธ หัว

ควบคุม .html นามสกุล

ไม่จำเป็น
cleanUrls แอตทริบิวต์ช่วยให้คุณควบคุมหรือไม่ URL ที่ควรจะรวมถึง .html ขยาย

เมื่อ true , โฮสติ้งโดยอัตโนมัติหยด .html ส่วนขยายจาก URL ไฟล์ที่อัปโหลด หาก .html ส่วนขยายจะถูกเพิ่มในคำขอ, โฮสติ้งดำเนินการ 301 เปลี่ยนเส้นทางไปยังเส้นทางเดียวกัน แต่ลด .html ขยาย

นี่เป็นวิธีการควบคุมรวมของ .html ใน URL ที่โดยรวม cleanUrls แอตทริบิวต์:

"hosting": {
  // ...

  // Drops `.html` from uploaded URLs
  "cleanUrls": true
}

ควบคุมเครื่องหมายทับต่อท้าย

ไม่จำเป็น
trailingSlash แอตทริบิวต์ช่วยให้คุณควบคุมหรือไม่ว่า URL ของเนื้อหาแบบคงที่ควรจะรวมถึงทับต่อท้าย

• เมื่อ true , โฮสติ้ง URL ที่เปลี่ยนเส้นทางเพื่อเพิ่มเฉือนท้าย
• เมื่อ false , โฮสติ้ง URL ที่เปลี่ยนเส้นทางในการลบทับต่อท้าย
• เมื่อไม่ได้ระบุ Hosting เพียงใช้เครื่องหมายทับต่อท้ายไฟล์ดัชนีไดเรกทอรี (ตัวอย่างเช่น about/index.html )

นี่เป็นวิธีการควบคุมการลากทับโดยการเพิ่ม trailingSlash แอตทริบิวต์:

"hosting": {
  // ...

  // Removes trailing slashes from URLs
  "trailingSlash": false
}

trailingSlash แอตทริบิวต์ไม่มีผลต่อการปรับเปลี่ยนเนื้อหาแบบไดนามิกจะเสิร์ฟโดยฟังก์ชั่นเมฆหรือ Cloud Run

การจับคู่รูปแบบ Glob

Firebase ตัวเลือกการกำหนดค่า Hosting ทำให้การใช้งานที่กว้างขวางของ รูปแบบ glob จับคู่ สัญกรณ์กับ extglob เหมือนกับว่า Git จับ gitignore กฎระเบียบและ ซุ้ม จับ ignore กฎ หน้าวิกิพีเดียนี้ คือการอ้างอิงรายละเอียดเพิ่มเติม แต่ต่อไปนี้เป็นคำอธิบายของตัวอย่างที่ใช้ในหน้านี้:

• firebase.json - ตรงกับเฉพาะ firebase.json ไฟล์ในรากของ public ไดเรกทอรี

• ** - แมตช์ไฟล์หรือโฟลเดอร์ในพลไดเรกทอรีย่อย

• * - ตรงกับเฉพาะไฟล์และโฟลเดอร์ในรากของ public ไดเรกทอรี

• **/.* - ตรงกับจุดเริ่มต้นไฟล์ใด ๆ . (มักจะซ่อนไฟล์เช่นใน .git โฟลเดอร์) ในพลไดเรกทอรีย่อย

• **/node_modules/** - แมตช์ไฟล์หรือโฟลเดอร์ในพลไดเรกทอรีย่อยของ node_modules โฟลเดอร์ที่ตัวเองสามารถอยู่ในพลไดเรกทอรีย่อยของ public ไดเรกทอรี

• **/*.@(jpg|jpeg|gif|png) - แมตช์ไฟล์ใด ๆ ในการให้พลไดเรกทอรีย่อยที่ลงท้ายด้วยตรงหนึ่งต่อไปนี้: .jpg , .jpeg , .gif หรือ .png

ตัวอย่างการกำหนดค่าโฮสติ้งแบบเต็ม

ต่อไปนี้เป็นเต็ม firebase.json ตัวอย่างเช่นการกำหนดค่าสำหรับ Firebase โฮสติ้ง หมายเหตุว่า firebase.json ไฟล์ยังสามารถมี การกำหนดค่าสำหรับการให้บริการ Firebase อื่น ๆ

{
  "hosting": {

    "public": "dist/app",  // "public" is the only required attribute for Hosting

    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],

    "redirects": [ {
      "source": "/foo",
      "destination": "/bar",
      "type": 301
    }, {
      "source": "/firebase/**",
      "destination": "https://www.firebase.com",
      "type": 302
    } ],

    "rewrites": [ {
      // Shows the same content for multiple URLs
      "source": "/app/**",
      "destination": "/app/index.html"
    }, {
      // Configures a custom domain for Dynamic Links
      "source": "/promos/**",
      "dynamicLinks": true
    }, {
      // Directs a request to Cloud Functions
      "source": "/bigben",
      "function": "bigben"
    }, {
      // Directs a request to a Cloud Run containerized app
      "source": "/helloworld",
      "run": {
        "serviceId": "helloworld",
        "region": "us-central1"
      }
    } ],

    "headers": [ {
      "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
      "headers": [ {
        "key": "Access-Control-Allow-Origin",
        "value": "*"
      } ]
    }, {
      "source": "**/*.@(jpg|jpeg|gif|png)",
      "headers": [ {
        "key": "Cache-Control",
        "value": "max-age=7200"
      } ]
    }, {
      "source": "404.html",
      "headers": [ {
        "key": "Cache-Control",
        "value": "max-age=300"
      } ]
    } ],

    "cleanUrls": true,

    "trailingSlash": false,

    // Required to configure custom domains for Dynamic Links
    "appAssociation": "AUTO",

  }
}