กำหนด Custom Domain ใช้งานร่วมกับ Firebase Hosting ตอนที่ 4

07 February 2020 By Ninenik Narkdee
dns checker firebase hosting firebase custom domain

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ dns checker firebase hosting firebase custom domain



เนื้อหาตอนที่ 2 และ 3 ที่ผ่านมา เราได้รู้จักกับการใช้งาน
Hosting site หรือ server ของ Firebase Hosting โดยเนื้อหา
ตอนที่ 3 เราได้สร้าง Multiple site ขึ้นมาชื่อ Hosting site ว่า
"app-firebase-2eb84" และมี domain สำหรับชี้ไปยัง site ดังกล่าว
2 ชื่อ domain คือ
    - app-firebase-2eb84.web.app
    - app-firebase-2eb84.firebaseapp.com
 
    ทบทวนเนื้อหาตอนที่แล้วได้ที่
    สร้าง Multiple Sites ใน Firebase Hosting เบื้องต้น ตอนที่ 3 http://niik.in/968 
 
 

การกำหนด Custom Domain

    คือ การที่เราต้องการใช้งานชื่อ domain ของตัวเอง แทนชื่อเดิมที่ firebase สร้างมาให้ อาจจะเพื่อต้องการสื่อ
ถึงรูปแบบของเว็บไซต์หรือ App เกี่ยวกับสินค้าหรือบริการ ต่างๆ หรือต้องการใช้เป็นชื่อเพื่อแนะนำตัวเอง เป็นต้น
หากยังไม่มีชื่อ domain สามารถจดชื่อ domain ใหม่ โดยสั่งซื้อจาก google ผ่านบริการ Google Domains  ก็ได้
ซึ่งง่าย รวดเร็ว และสะดวก หรือจดกับผู้บริการอื่นที่ต้องการก็ได้
 
 

ตั้งค่า Domain ใช้งานร่วมกับ Firebase Hosting

    เมื่อเรามีชื่อ domain พร้อมแล้ว ก็จะไปสู่ขั้นตอนการตั้งค่า เพื่อใช้งานร่วมกับ firebase hosting ในที่นี้ เราจะใช้กับ
ตัวอย่าง เป็น app-firebase-2eb84 และใช้ชื่อ domain ว่า zabiny.com ที่จดไว้กับผู้ให้บริการหนึ่ง ดังนั้น ในขั้นตอนนี้
เราต้องเข้ายังเว็บไซต์ หน้าจัดการ domain ของผู้ให้บริการที่ใช้อยู่ ดูในส่วนของการกำหนด DNS ควบคู่ไปกับการตั้งค่า
ในส่วนของ Firebase console
    เริ่มต้นให้เราเข้าไปใน Firebase console ไปที่เมนู Hosting เลือก Hosting site ที่ต้องการ 
 
 

 
 
    กดไปที่เมนู "Add custom domain" 
 
 

 
 
    กรอกชื่อ domain ที่ต้องการเชื่อม แล้วกด Contnue

 

 
 
    จะขึ้นค่า resource record ที่เราต้องไปเพิ่มเข้าไปในระบบจัดการ DNS record ของผู้ให้บริการที่เราใช้งานอยู่
ก่อน โดยยังไม่ต้องกดปุ่ม Verify
    ให้เรา กรอกค่าตามที่ ระบบกำหนดมาให้ เพื่อใช้สำหรับการยืนยัน หรือ verify การเป็นเจ้าของ Domain
 
 

 
 
    สังเกตในส่วนของ Host เราสามารถกรอกเป็น @ แทนได้ ในที่นี้ได้กรอกเป็น zabiny.com และระบบอัพเดทเป็น @ 
ให้อัตโนมัติ
 
    เราสามารถตรวจสอบว่า ค่าที่เรากำหนดมีการอัพเดทใน DNS record แล้วหรือยังได้ที่เว็บไซต์ DNSCHECKER 
กรอกชื่อ domain และเลือกค่า TXT แล้วกด Search 
 
 

 
 
    หากค่ามีการอัพเดทครบเรียบร้อยแล้ว ให้เรากลับมากดปุ่ม Verify หากผ่านในขั้นตอนนี้แล้ว จะขึ้นการกำหนดค่าตัว
ถัดมาดังรูป
 
 

 
 
    ทำเหมือนเดิม ไปเพิมค่าในส่วนของ A records ทั้งสองค่าในหน้าจัดการ DNS record
 
 

 
 
    หลังเพิ่มเรียบร้อยแล้ว เราสามารถกลับมากดปุ่ม Finish เพื่อรอการอัพเดทสักครู่ สถานะในตอนนี้จะเป็น "Need setup" 
ตามรูปด้านล่าง

 

 
 
    เราสามารถไปตรวจสอบการกำหนด ค่า A records ดังนี้
 
 

 
 
    ซึ่งหากค่าทั้งหมด หรือโดยส่วนใหญ่เกือบทั้งหมดอัพเดทแล้ว สถานะจะขึ้นเป็น "pending"
 
    เราสามารภเพิ่ม domain ในรูปแบบ www.zabiny.com ตามคำแนะนำ ไนขณะที่กำลังรอ เพื่อให้สามารถเรียกใช้งาน server
ผ่าน www และเมื่อกด Add จะขึ้นให้กรอกชื่อตามรูป
 
 

 
 
    ในที่นี้เรากำหนดให้มีการ redirect ไปยัง zabiny.com กรณีพิมพ์เข้าเว็บไซต์เป็น www.zabiny.com 
เพื่อตัด www ออกอัตโนมัติ จะได้ชื่อ domain มีความกระชับ กด Continue ต่อ
 
 

 
 
    ขั้นค่า A records ให้เรานำค่าไปกำหนดใน DNS records เหมือนเดิม
 
 

 
 
    ในส่วนของ Host เราสามารถกำหนดเป็น www สำหรับ www.zabiny.com ได้ ในที่นี้เรากรอกแบบเต็ม 
ระบบเปลี่ยนเป้นค่า www อัตโนมัติ
 
    เหมือนเดิม เราสามารถไปตรวจสอบค่าที่กำหนดว่ามีการอัพเดทแล้วหรือไม่
 
 

 
 
    กรณีนี้ เราต้องเปลี่ยนชื่อ domain มี www นำหน้าด้วย
 
    ในขณะที่ค่าเป็นสถานะ "pending" เราสามารถลองเข้ายัง domain ที่เรากำหนดดู 
 
 

 
 
    จะพบว่าตอนนี้ domain ของเราได้เชื่อมกับ Firebase hosting แล้ว แต่ยังต้องรอให้ส่วนของการจัดการ SSL ซึ่งจะใช้เวลาสักพัก
แต่ที่ทดสอบดู ประมาณ 5-10 นาที ในบางกรณีอาจจะเป็นวันๆ ขึ้นอยู่กับการอัพเดทสถานะของ DNS
 
 

 
 
    และหลังจากเปลี่ยนเป็นสถานะ "connected" แสดงว่า domain ของเราสามารถเรียกใช้งานไปยัง firebase hosting ได้อย่างสมบูรณ์
รองรับ SSL เรียบร้อบแล้ว
 
 

 
 
    ผลลัพธ์ที่ได้ เมื่อเข้าเว็บไซต์ผ่าน zabiny.com หรือ www.zabiny.com
 
 

 
 
    เท่านี้ก็เป็นอันเสร็จเรียบร้อย สำหรับการใช้งาน domain ร่วมกับ Firebase Hosting ให้เรามีเว็บไซต์ ได้ง่ายๆ 
    เนื้อหาเกี่ยวกับการใช้งาน Firebase Hosting เบื้องต้นก็จะมีเท่านี้ก่อน หากมีอะไรเพิ่มเติมจะได้นำมาอัพเดท แนะนำต่อไป
 
    สำหรับการใช้งาน Firebase ในส่วนต่อไป จะเป็นอะไรนั้น รอติดตาม


กด Like หรือ Share เป็นกำลังใจ ให้มีบทความใหม่ๆ เรื่อยๆ น่ะครับ







เนื้อหาที่เกี่ยวข้อง









URL สำหรับอ้างอิง











เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ