Google Cloud Storage 独自ドメインで静的ウェブサイトをホストする

クラウド
2017.07.08
クラウド
GoogleクラウドGCP
スポンサーリンク

Google Cloud Storage（GCS）は、データ配信やバックアップなど色々な用途に使える Google Cloud Platform のストレージサービスです。AWS S3 の競合にあたるサービスになります。そこで今回は、Google Cloud Storage を使い独自ドメインで静的ウェブサイトをホストする手順をまとめてみました。

  1. ドメイン所有権の確認
    1. 別のGoogleアカウントにドメイン所有権を設定
  2. CNAMEエイリアスの作成
  3. バケットの作成
  4. インデックスページと404ページの設定
  5. コンテンツファイルのアップロード
    1. クライアントソフトでアップロード
    2. Google Cloud Storage は CDN として機能する
  6. アップロードしたファイルが一般公開になるように設定
  7. Google Cloud SDK のインストール
  8. Google Cloud SDK の初期化
    1. Google Cloud SDK の認証
    2. プロジェクトIDの選択
  9. おわりに

ドメイン所有権の確認

Google Cloud Storage で独自ドメインを使って静的ウェブサイトをホストするのにあたって AWS S3 と大きく異なるのが、バケットを作る前にドメイン所有権の確認が必要なことです。この確認は Google Search Console（以前はウェブマスターツールという名前でした）を使って行います。

Google Cloud Platform で使っている Googleアカウントで Google Search Console にログインします。（別の Googleアカウントで確認が必要な場合は、所有権限を Google Cloud Platform で使っている Googleアカウントに設定することもできます）

これから作成するウェブサイトのURLを入力して「プロパティを追加」をクリックします。現時点（2017年7月8日）で Google Cloud Platform は、独自ドメインでの HTTPS には対応していないので「http://」からはじまるURLを入力します。

「別の方法」→「ドメイン名プロバイダ」をクリックします。

ドメイン名プロバイダ「その他」を選択し、表示されたTXTレコードをDNSサーバーに追加します。TXTレコードが追加できない場合は「CNAME レコードを追加する」をクリックします。

表示されたCNAMEレコードをDNSサーバーに追加します。

TXTレコードもしくはCNAMEレコードをDNSサーバーに追加し、「確認」ボタンをクリックするとドメイン所有権が確認されます。

別のGoogleアカウントにドメイン所有権を設定

別のGoogleアカウントにドメイン所有権を設定する場合は、以下のURLで英語版の Search Console を開きます。※日本語版の Search Console でも所有権を設定することはできますが Google Cloud Platform から所有者として認識されないようです。（2017年7月7日現在）

https://www.google.com/webmasters/verification/details?hl=en&domain=＜ドメイン名＞

「Add on owner」に所有権を設定するGoogleアカウントを入力して「Continue」をクリックすれば、ドメインの所有権が設定されます。

CNAMEエイリアスの作成

独自ドメイン名のURLで Google Cloud Storage にアクセスできるように、以下のCNAMEレコードをDNSサーバーに追加します。

gcs.apar.jp. IN CNAME c.storage.googleapis.com.

バケットの作成

まずはじめに Google Cloud Platform のコンソールで、プロジェクトを作成または選択します。プロジェクトのIDは後々の設定で使いますのでメモしておきます。

コンソール左上の「≡」メニューから「Storage」→「ブラウザ」を選択します。

「バケットを作成」をクリックします。

静的ウェブサイトをホストする場合、バケットの名前は必ずドメイン名と同じものを入力します。デフォルトのストレージ クラスは「Multi-Regional」、ロケーション「アジア」を選択して「作成」をクリックします。

インデックスページと404ページの設定

「バケット」をクリックして、バケットの一覧画面に移動します。

右はじのメニューから「ウェブサイトの設定を編集」を選択します。

メインページ（インデックスページ）と 404ページのファイル名を入力して「保存」をクリックします。

コンテンツファイルのアップロード

ウェブサイトで表示するコンテンツファイルをアップロードします。

先ほど作成したバケットに移動します。

「ファイルをアップロード」をクリックして、コンテンツファイルをアップロードします。

アップロードしたファイルの「一般公開で共有する」にチェックを入れます。

以上で、独自ドメインで静的ウェブサイト公開の設定完了です。ブラウザでアクセスして、インデックスページと404ページが表示されることを確認します。

クライアントソフトでアップロード

Google Cloud Storage にクライアントソフトでファイルをアップロードすることもできます。詳しくは「Google Cloud Storage のGUIクライアント Cyberduck でアップロード」の記事をご参照ください。

Google Cloud Storage は CDN として機能する

Google Cloud Storage 一般公開しているファイルは、なにもしなくても CDN にキャッシュされます。パフォーマンス的にはうれしい反面、ファイルを更新した場合すぐには反映されないので注意が必要です。

一般公開で閲覧可能なオブジェクトはデフォルトで Cloud Storage ネットワークにキャッシュされるので、特に設定しなくても、Cloud Storage は基本的に Content Delivery Network（CDN）のように機能します。

https://cloud.google.com/storage/docs/static-websitea　より引用

独自ドメインにこだわらなければ、以下のURLで HTTP / HTTPS のどちらでもファイルにアクセスできますので、Google Cloud Storage は手軽な CDN としても活用できますね。（HTTPS でアクセスすれば、HTTP/2 プロトコルが使われます）

https://storage.googleapis.com/＜バケット名＞/

アップロードしたファイルが一般公開になるように設定

Google Cloud Storage にアップロードしたファイルは、あたり前ですが必ず非公開に設定されます。しかしウェブサイトをホストする場合は、ファイルをアップロードするたびに「一般公開で共有する」にチェックを入れなければなりません(^^;)

これではかなり不便ですので、アップロードしたファイルが常に「一般公開」に設定されるようにバケットの設定を変更します。この設定はコンソール画面ではできないため Google Cloud SDK にふくまれる gsutil コマンドで行います。このSDKのインストール方法は「Google Cloud SDK のインストール」を参照してください。

まず gcloud コマンドで、プロジェクトを Google Cloud Storage バケットを作成したプロジェクトに切り替えます。

gcloud config set project ＜プロジェクトID＞

デフォルトのファイルアクセス権を一般公開（public-read）に変更します。

gsutil defacl set public-read gs://gcs.apar.jp

設定を確認します。下のような表示であればOKです。

gsutil defacl get gs://gcs.apar.jp
 
{
  "entity": "allUsers",
  "role": "READER"
}

また gsutil rsync コマンドを使って大量のファイルをアップロードすることもできます。ディレクトリツリーごとをコピーする場合は「-R」（再起コピー）オプションを指定します。

gsutil rsync -R htdocs gs://gcs.apar.jp

Google Cloud SDK のインストール

SDKのインストールの前に、システムに Python 2.7 がインストールされていることを確認します。最近のmacOSやCentOS7であれば、Python2.7がインストールされていると思います。（今回はmacOS10.12のマシンにインストールしました）

$ python -V
Python 2.7.10　←　インストールされている

ローカルPCがWindowsの場合は「Windows 用のクイックスタート | Cloud SDK のドキュメント」ページから、インストーラをダウンロードできます。

SDKをインストールしたいディレクトリに移動して、以下のコマンドを実行します。

$ cd ~
$ curl https://sdk.cloud.google.com | bash

SDKのインストール先ディレクトリの指定です。よければそのままエンターを押してください。SDKのダウンロードが始まります。

Installation directory (this will create a google-cloud-sdk subdirectory) (/Users/foo): ＜そのままエンター＞

SDKがクラッシュした場合に、匿名化された使用データをGoogleに送ってもいいか聞かれます。（ここはお好みで選択してください）

Do you want to help improve the Google Cloud SDK (Y/n)?

シェルの設定ファイルに SDKコマンドへのパスを追加してもいいか聞かれますので「Y」を入力してください。

Modify profile to update your $PATH and enable shell command
completion?
Do you want to continue (Y/n)? Y

シェルの設定ファイルのパスの確認です。よければそのままエンターを押してください。

Enter a path to an rc file to update, or leave blank to use
[/Users/foo/.bash_profile]:

シェルの設定ファイルを再読み込みして「gcloud」コマンドが実行できることを確認します。

$ source ~/.bash_profile
$ gcloud help
（ヘルプが表示されればOKです）

続いて Google Cloud SDK の初期化を行います。

Google Cloud SDK の初期化

Google Cloud SDK の認証

Googleアカウントで Google Cloud SDK をアプリ認証します。以下のコマンドを実行してください。

$ gcloud init

Googleアカウントにログインしていいですか？ と聞いてきますので「Y」を入力します。（WEBブラウザが開きます）

You must log in to continue. Would you like to log in (Y/n)? Y

Google Cloud Platform で使っている Googleアカウントを選択します。

Google Cloud SDK のリクエストを許可します。（この許可はGoogleアカウントの管理画面でいつでも取り消すことができます）

「Google Cloud SDK の認証が完了しました」が表示されたら、ターミナル（コマンドプロンプト）に戻ります。

プロジェクトIDの選択

Google Cloud Storage でバケットを作成したプロジェクトを選択します。

Pick cloud project to use:
[1] feisty-flames-172019
[2] xxxxxx-xxxxxx-999999
Please enter numeric choice or text value (must exactly match list
item): 1

Compute Engine（仮想サーバー）の設定をはじめようとすることがありますが「n」を入力してキャンセルしてください。

API [compute-component.googleapis.com] not enabled on project
[601299124237]. Would you like to enable and retry? (Y/n)? n

以上で Google Cloud SDK の初期化終了です。上の手順に戻ってアップロードしたファイルが一般公開になるように設定します。

おわりに

Google Cloud Storage で静的ウェブサイトをホストする場合 AWS S3 と比べると多少手順が多いですが、ドメイン所有権をしっかり確認するあたりがWEB番長のGoogleさんぽいですね。独自ドメインでも HTTPS に対応してくれるのを期待します！

コメント

タイトルとURLをコピーしました