iT邦幫忙

2021 iThome 鐵人賽

DAY 27
1
Modern Web

1995到2021,php到react網站開發歷程系列 第 27

DAY27-Firebase Domain設定

前言:

昨天跟大家介紹了如何把你寫好的網頁透過firebase deploy到網路上,但目前還只能透過一個預設的網址來做連結,像下面這樣看起來很沒fu。

截圖 2021-10-09 下午8.11.19.png

今天阿森就來介紹firebase的custom domain要怎麼設定吧!

怎麼購買自己的domain name:

要買domain其實有很多路徑,像是PChome:

http://myname.pchome.com.tw/

中華電信HiNet:

https://domain.hinet.net/#/

Google domain:

https://domains.google.com/registrar/search?hl=zh-TW

GoDaddy:

https://tw.godaddy.com/offers/godaddy?isc=gofktw06&countryview=1&currencyType=TWD&gclid=Cj0KCQjw-4SLBhCVARIsACrhWLUTJ5ymtUvPVDnw6tMoOBcFiChg-IZcIuhhYqyAKgLNJDGtcXIDMQsaAg3EEALw_wcB

等等。

這裡阿森在搜尋一輪查詢完價格後,覺得最划算的應該是Google domain和GoDaddy的價格,但礙於前者目前還沒開放支援台灣的張單地址,我最後選了GoDaddy來買我們的域名。

截圖 2021-10-09 下午8.20.24.png

那要買域名其實很簡單,直接搜尋你想要的名字,他就會出現這個網域的年價:

截圖 2021-10-09 下午8.22.30.png

通常這種越簡單的會越貴,也有可能已經被人買走,你要用就要接他的二手價。

Firebase X GoDaddy:

要把域名串到firebase上只要先打開firebase → hosting → 新增自訂網域:

截圖 2021-10-09 下午8.29.15.png

輸入你的網域後,會接著要你驗證這個網域真的是屬於你的,這時候應該會跟你說用TXT驗證,同時給你一個名稱和一串像是亂碼的值,這時候先把值複製起來,打開GoDaddy → 我的產品 → 管理DNS:

截圖 2021-10-09 下午8.33.32.png

在記錄的右下角點加入,然後類型選剛剛說的TXT,但這裡主機要打@,代表只要這串值對了任何主機名稱都接受,因為GoDaddy的主機選項好像有點bug。我一開始試firebase給的主機名稱也會出錯,後來查了stackOverflow才發現大家都有這個問題。

再來是TTL,TTL 的全名叫做 Time to Live,是 DNS 解析的時候在使用的,主要的作用是設定每一筆紀錄在 DNS 快取伺服器所保留的時間。這裡因為我們是架在firebase上的,阿森認為應該不用很頻繁,所以就選一個小時。

完成後再回到firebase做認證,應該不會有問題!

之後可能要等一下,讓這個網域生效,同時也讓他跑一下https,之後才不會出現不安全的連線等警告。

截圖 2021-10-09 下午8.39.58.png

成功後網域的畫面應該是這樣,這裡附上我們的網址,讓大家試試看!
https://thedinomension.com/

有興趣也可以訂閱喔!XD

小結:

今天介紹了如何購買網域,以及如何在伺服器端更改成自己的domain,其實大部分步驟都滿直觀的,只有主機名稱那一步大家可能會遭遇到問題,也希望這篇文章能解決這個問題,讓大家的網站都順利上線!

那今天就先這樣,我們明天見!


上一篇
DAY26-在firebase上架你的react網站吧
下一篇
DAY28-React NFT網站成果展示
系列文
1995到2021,php到react網站開發歷程30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
ALu
iT邦新手 3 級 ‧ 2022-04-23 23:48:28

真實用,太趙了吧

我要留言

立即登入留言