想ひ出のへっぽこBlogⅡ from35

~ 自身の備忘録および学習促進のためにブログります。~

想ひ出8: GCP/今さら静的ウェブサイトのホスト

f:id:moqrin3:20181201092259p:plain
Cloud Storage

おはようございます、moqrinです。
大分期間が空いてしまいました。。全然更新できていないのですが、
この間、Nuxt.jsSpringBoot でコードを書いていたりしていました。。
機会があれば、SpringBootJavaKotlin 関連についてはいつか記事にしたいです。

それはさておき、掲題の件、GCPを触りたい、触りたいと思っていたのですが、
ついに触れ始めたので、出遅れ感満載ですが、早速やってみました。
ほとんど、チュートリアルと諸先輩方の通りでございます。

このクソブログを見るまでもないです!

やったこと

1. ドメインの取得
2. Cloud DNSからDNSゾーンの作成 + Cloud DNSでCNAME レコードの作成
3. ドメインを取得したレジストラにNSを設定
4. SearchConsoleでサイトの登録
5. バケットの作成と適当なファイルをアップロード
6. MainPageSuffix と NotFoundPage の設定
7. 確認する
8. 嬉しい

1. ドメインの取得

12ヶ月間無料でドメイン登録できるFreenomで、ドメインを取得します。

f:id:moqrin3:20181201093345p:plain

f:id:moqrin3:20181201093357p:plain

2. Cloud DNSからDNSゾーンの作成 + Cloud DNSでCNAME レコードの作成

適当な名前でゾーンを作成します。

f:id:moqrin3:20181201093903p:plain

チュートリアルにあるように、CNAMEでレコードを作成します。

f:id:moqrin3:20181201093925p:plain

3. ドメインを取得したレジストラにNSを設定

f:id:moqrin3:20181201093946p:plain

Freenomの登録画面に進みます。

f:id:moqrin3:20181201094003p:plain

NSレコードを登録します。

f:id:moqrin3:20181201094018p:plain

4. SearchConsoleでサイトの登録

このままバケットを作って進めようとすると、ドメインの所有オーナーであることを証明しろ
って怒られるので、TXTレコードを登録することで対応します。
まずは、SearchConsoleにGo。

f:id:moqrin3:20181201094035p:plain

作成したドメインを入力します。

f:id:moqrin3:20181201094049p:plain

TXTレコードを登録します。(再掲)

f:id:moqrin3:20181201093946p:plain

しばらくしてからSearchConsole画面から確認ボタンを押すと完了!

f:id:moqrin3:20181201094104p:plain

5. バケットの作成と適当なファイルをアップロード

バケットを作成

f:id:moqrin3:20181201094118p:plain

ファイルを適当に作成してアップロード

f:id:moqrin3:20181201104040p:plain

全公開の設定にしたいので、

f:id:moqrin3:20181201104122p:plain

allUsersを追加します。

f:id:moqrin3:20181201104148p:plain

6. MainPageSuffix と NotFoundPage の設定

f:id:moqrin3:20181201104215p:plain

7. 確認する

トップページ

f:id:moqrin3:20181201104249p:plain

ないページにアクセス

f:id:moqrin3:20181201104312p:plain

8. 嬉しい

わーい。

参考:

静的ウェブサイトのホスト

GCP上で独自ドメインを使う

Google Cloud Storage で独自ドメインで静的サイトホスティング