*

静的HTMLをGAE上で公開する

公開日: : 最終更新日:2015/06/15 投稿者: GAE

みなさんこんにちは。
本日は、静的HTMLをGAEで公開する手順を紹介します。
本サイトを運営している弊社のコーポレートサイトも、こちらの方法を使って運営しております。
ホームページの公開、メンテナンスもGAEを使えば簡単に行う事が出来ます。

用意するもの

  • gmailアカウント
  • Eclipse

1:Gmailアカウントを取得

GAEを利用するにはGmailアカウントが必要になります。
取得はこちらより出来ます。

2:Developer Consoleでプロジェクトを作成する

アカウントを作成後、Developer Consoleに行き、プロジェクトを作成します。
Developer Console へはこちらから
[プロジェクトを作成]ボタンをクリックすると、プロジェクト名とプロジェクトIDを入力する画面が表示されます。

hog_001

プロジェクト名は、任意の名前が付けられます。
プロジェクトIDにデフォルトで名前が入っていますが、ここは変更して、プロジェクト名と同じものを入れて下さい。

理由として

  • プロジェクト名と、プロジェクトIDが相違していると、何がどれに利用されているか不明になり煩雑になってしまう
  • プロジェクトIDはドメイン名に繋がってくる (標準的なURLは http://[プロジェクトID].appspot.com になります)

という点が挙げられますので、慎重に指定しましょう。
今回は[apps-gcp]というプロジェクト名で作成していきます。

3:Eclipseを取得

開発環境ツールのEclipseを導入します。
ダウンロードはこちらから。
ご自身の環境に合わせたバージョンをダウンロードしてください。
PHP,Javaあたりはあった方が後々良いですが、htmlエディタの機能があればOKです。

4:EclipseにGoogleのプラグインを入れる

Eclipseにgoogleのプラグインを入れます。
以下から、Eclipseのバージョンにあったものをインストールしてください。
https://cloud.google.com/appengine/docs/java/tools/eclipse

5:プロジェクトを作成

GAEにHTMLをアップロードするには、Eclipse内にプロジェクトを作成する必要があります。
プロジェクト作成は、googleのマークタブ内、[新規Webアプリケーション・プロジェクト…]をクリックするとプロジェクト作成画面が開き、ここから作成可能です。

hog_002

EclipseのGAEプラグインがインストール済だと上記のGoogleマークのアイコンが出てきます。

hog_003

プロジェクト名とパッケージ名を入れます。
プロジェクト名はEclipse上でサイトを管理するときの名称になります。下の画面キャプチャの状態では、「AppsGCP」を指定しています。
パッケージ名は任意であり、静的なHTMLを配置するだけであればどこにも影響を与えません。英小文字と数字とドットが使えますが、ドット・数字は単体では使えません。
また静的なHTMLを配置するだけの場合は不要となる[Google Web ツールキットを使用]と[プロジェクト・サンプル・コードを生成する]のチェックを外しておきます。

HTMLはこのプロジェクト内に入れます。
デフォルトでは、プロジェクトのwarフォルダの下に配置する必要があります。
warフォルダの下にはWEB-INFフォルダがありますが、こちらは削除してはいけません。

6:HTMLをアップロードする

静的HTMLが完成したら、いよいよGAE環境にアップロードします。
アップロードするHTMLが入ったプロジェクトを選択し、メニューバーのgoogleタブを開き、[Appエンジンへデプロイ]をクリックします

hog_004

hog_005

出てきたウインドウの左下[App Engine プロジェクト設定…]をクリックします。

hog_006

こちらで詳細設定が可能です。
アプリケーションIDには、Developer Consoleで作成したプロジェクト名を入力します。
バージョン名は任意の名前が付けられます。ハイフン(-)は利用出来ますが、アンダーバー(_)は利用出来ません。

設定が完了したら、右下の[OK]をクリックすると、GAE上へのデプロイが開始されます。

7:デプロイ完了チェック

完了したかどうかは、GAEのコンソール上から確認する事が出来ます。

コンソールは
https://console.developers.google.com/project/プロジェクト名/appengine
で確認出来ます。
コンソール内、計算処理→App Engine→バージョンと進むと、確認する事が出来ます。

hog_007

8:バージョンの切替え

GAE上にアップロードをする際、バージョン名を指定してアップロードをする事が可能です。
バージョンの切替も簡単に行えます。
バージョン一覧は、左メニュー内、計算処理→App Engine→バージョンから確認する事が出来ます。
1番初めにアップロードしたバージョンがデフォルトになります。
後からアップロードしたバージョンは自動でデフォルトになりません。
アップロードしたバージョンをデフォルトにするには、デフォルトにしたいバージョン名の横のチェックボックスにチェックを入れ、上部の[デフォルトにする]をクリックすると、公開されるようになります。

hog_008

バージョンは10個まで作成する事が可能です。この数は、課金をすると20個となり、更にプレミアサポートに入ると60個まで増やすことが出来ます。

弊社では、完成したHTMLを別名のバージョンでアップロードしておき、社内でのレビュー完了後、OKであれば、デフォルトに切り替える事によって公開しています。
何か失敗してしまっても、以前のバージョンにすぐに切り替える事が出来るので大変便利です。

GAEは送信データ料1GB/日まで無料で使えます。
静的コンテンツの場合にはこの部分以外の課金クォータにかかることは基本的にありませんので、サイトの内容にもよりますが、ページあたりの平均サイズが100K程度であれば1万PV/日まで無料で公開可能となります。

以前、GAEに上げた静的コンテンツの負荷テストも行いました。
どれだけのアクセスに耐えられるか、過去のデータになりますが、ご参考にごらんください。

タイトル
Part1 GAE負荷テスト その1「Hello World!」
Part2 GAE負荷テスト その2「吉積情報株式会社の旧トップページ」

みなさんもサイトを作成する際はGAEを使ってみてはいかがでしょうか。

吉積情報ではGAEを活用したWebサイト開発やWebサービス開発を専門的に行っております。
是非ご興味のある方は、弊社の実績ギャラリーをご覧ください。

この記事を書いた人

kimura
kimura
Webデザイナー。本サイトの管理・デザイン担当をしております。
 

関連記事

Google App EngineからのSpreadSheetの権限変更について

Google App Engine(以下GAE)からGoogleDocsのSpreadSheetを操

記事を読む

Google App Engine コンソールの小技

みなさんご存知、GAEのコンソールにはさまざまな機能があります。 あなたがデプロイしたアプリケ

記事を読む

たった1つのCloud SQLインスタンスで複数のWordPressを動かす

皆様こんにちは。 前回はCloudSQLやCloud Storageを用いてWordpress

記事を読む

Search APIの「Faceted Search」を使ってみた

Search API詳細解説シリーズは完結しましたが、2015年2月19日のAppEngine SD

記事を読む

PaaS最前線!たったの15分でできるGAE/GO入門!

はじめに 2015年7月ついにGoogle App EngineのGO言語正式サポートが決定しまし

記事を読む

GAEのスケーリング 後編 <最適化の実践>

この記事では、こちらの公式ドキュメントをもとに、GAEのスケーリングの仕組みと最適化のやり方について

記事を読む

Search API詳細解説 Part4「Search API 詳細 検索性能編」

Search API詳細解説シリーズ タイトル Part1Search API 概要説明

記事を読む

GCP愛を語る

RGCP(GCP好き以外お断り) 技術的な話ばかりの中のAdventCalendarですが、本

記事を読む

AppEngine Security Scan Tool

AppEngine Security Scan Toolが利用出来るようになりました。ついては、GA

記事を読む

GAEでよくあるエラーの発生原因と対策1

GAE上で動くWebアプリケーションに特有の例外について、弊社での運用の事例からいくつか特徴的なもの

記事を読む

PAGE TOP ↑