กำหนด Custom domain ให้กับ Web บน Github Pages

by ,

หลังจากทำโครง Web บน Github Pages เริ่มเป็นรูปเป็นร่างแล้ว จะเข้าเว็ปผ่าน piruin.github.io ต่อไปก็รู้สึกมันไม่เท่สักเท่าไหร่ เลยตัดสินใจเช่า Domain piruin.me และลงมือทำ Custom Domain กันสักหน่อย

เรื่องนี้ใช้เวลาแป๊บเดียวและไม่ยากครับ แม้แต่มือใหม่เพิ่งมีเว็ปที่จดโดเมนเป็นของตัวเองครั้งแรกแบบผมยังทำได้ภายในครึ่งชั่วโมง

ลงมือซิครับ! รออะไร?

ค่าที่ใช้ในบทความนี้เป็นของจริงจากที่ผมทำเว็ปนี้เลย ซึ่ง Requirement ของผมคือ สามารถเข้าผ่าน piruin.me เป็นหลัก แต่ถ้าพิมพ์ว่า www.piruin.me เข้ามาก็ต้องเข้ามาที่ piruin.me ได้เช่นกัน ไม่ใช่เจอหน้า 404

GitHub

ก่อนอื่นเราต้องบอก GitHub ก่อนว่าเราจะใช้ Custom Domain แล้วนะ โดยทำตามนี้

  1. เข้าไปที่ setting ของ Project ของ Website ของเรา
  2. ที่หัวข้อ Custom Domain ใส่ชื่อโดเมนของเรา เช่น piruin.me แล้วกด save

จากนั้น github จะทำ commit ไฟล์ชื่อ CNAME ให้เราโดยมีชื่อโดเมนที่เราใส่ไปให้โดยอัตโนมัติ เท่านี้เป็นอันเสร็จส่วนแรก

ตั้งค่า DNS

ต่อไปเราจะทำการบอกให้ DNS รู้ว่า ถ้ามีคนพิมพ์ piruin.me ให้พาไปที่เครื่อง server เครื่องไหน Ip อะไร หรือถ้าพิมพ์ www.piruin.me จะให้ Reirect ไปไหน

  1. เข้าไป Website ที่เราจดโดเมนไว้ เช่น GoDaddy Namecheap 9ล9
  2. หาเมนูที่เกี่ยวกับการตั้งค่า DNS ของเจ้านั้น (ขั้นตอนนี้เป็นขั้นที่ยากที่สุดแล้ว)
  3. ทำการเพิ่ม Record ทั้งหมด 3 อันดังนี้
    • ประเภท A, Host @, IP 192.30.252.153
    • ประเภท A, Host @, IP 192.30.252.154
    • ประเภท CNAME, Host www, ใส่ domain เดิมของ github page ของเรา เช่น piruin.github.io สำหรับ website ของผม
  4. กด Save ถ้ามีให้กด แล้วรอ

ถ้าอยากเห็นผลเร็วๆ ตอนเพิ่ม Record ให้กำหนดค่า TTL ให้มีค่าน้อยๆเข้าไว้

ผลลัพธ์

หลังจากผ่านไป ไม่น่าจะเกินครึ่งชั่วโมง เราจะสามารถเข้า Website ของเราไปด้วย piruin.me หรือจะพิมพ์ว่า www.piruin.me ก็ได้เช่น ซึ่งจะ Redirect ไปที่ piruin.me แทน

เราทำอะไรลงไป

ตอนที่เราเพิ่ม DNS Record ประเภท A เป็นการบอกว่า ถ้ามีคนพิพม์ Apex Name (piruin.me) ให้ชี้ไปที่ IP 192.30.252.153 หรือ .154 ซึ่งเป็น IP ของ Github Pages ส่วนตอนที่เพิ่มประเภท CNAME เราใส่ host เป็น Subdomain (www) แล้วให้ชี้ไปที่ domain default ของ Github Pages เดิมของซึ่งตอนนี้ CNAME ที่ Project ของเรากำหนดให้เป็น apex name ทำให้เมื่อพิมพ์ว่า www.piruin.me จะถูก Redirect ไปที่ piruin.me แทน

ทิ้งท้าย

ถ้าเราอยากให้คนเข้า Web เราด้วย Subdomain www. เป็นหลักแทนที่จะเป็น Apex Name หละ คิดว่าจะต้องเปลี่ยนตรงไหนบ้างครับ?

« Hello World - I'am Blast Piruin