#概要
##何ができるのか
- WordPressの「StaticPress S3」プラグインを使うことで、WordPressサイトの静的コンテンツをAmazon S3でWebホスティングすることができます
- WordPressは静的コンテンツを吐き出すだけなので、サーバスペックは最低限でOKです
- イベントサイトなどの永代供養に最適です
- メールフォームなどPOSTを伴うコンテンツやGetによる検索クエリは利用できません。CloudFrontを利用しましょう
WordPressサイトをCloudFrontで配信する
＜参考＞JAWS-UG京都 第5回勉強会登壇スライド
ヤフー砲も怖くない!? WordPressとS3で落ちない コーポレートサイトを立ち上げよう
##前提条件
- WordPressのインストールが完了していること。本手順は、AMIMOTO AMI(Apache HTTPD PHP7)の環境が前提となっていますので、他の環境では期待通りの動作をしない可能性があります
http://qiita.com/Ichiro_Tsuji/items/88f9009f80f3439ad9fa - WordPressサーバにSSHでアクセスできること
- S3のバケットがWeb公開できる状態になっており、APIアクセス用のKeyが取得できていること
http://qiita.com/Ichiro_Tsuji/items/c174d580587a622d3358 - 手順中に登場するFQDN(サイトのURL)は下記の通りです。ご自分の環境に合わせて読み替えて下さい
Wordpressサイト -> wp.jaws-ug.tk
S3バケットのWeb公開 -> s3.jaws-ug.tk
- 独自ドメインをもっていない場合は下記の通り読み替えて下さい
Wordpressサイト -> WordPressサーバのPublic DNS
S3バケットのWeb公開 -> S3バケットのEndpoint
#プラグインをインストールする
##StaticPress S3プラグイン
- WordPressサーバにSSHでアクセスし、下記コマンドを実行する
※ SSH接続できない場合はこちら
※i-xxxxxxxxは、AMIMOTO AMIインストール時に指定したインスタンスID。i-まで入力してTabキーで補完してもよい
$ cd /var/www/vhosts/i-xxxxxxxx/wp-content/plugins
$ sudo git clone https://github.com/megumiteam/staticpress-s3.git
$ sudo chown -R nginx:nginx staticpress-s3
##StaticPressプラグイン
- WordPressダッシュボードを開く
- [プラグイン] -> [新規追加]
- 「staticpress」で検索し、[今すぐインストール]をクリックする
##プラグインの有効化／停止
- [プラグイン]をクリックする
- Nginx Cache Controllerの[停止]をクリックする
- StaticPressの[有効化]をクリックする
- StaticPress S3の[有効化]をクリックする
#各種設定
設定中の**wp.jaws-ug.tk**は、自分のWordPressサイトアドレスに読み替えてください。
##リバースプロキシキャッシュの削除
- WordPressサーバにSSHでアクセスし、下記コマンドを実行する
$ sudo rm -rf /var/cache/nginx/proxy_cache
##コード修正
- WordPressサーバにSSHでアクセスする
###class-S3_helper.phpの修正
$magic_fileのパスをAMIMOTO環境に合わせて修正します。
※ i-xxxxxxxxは、AMIMOTO AMIインストール時に指定したインスタンスID。i-まで入力してTabキーで補完してもよい
$ cd /var/www/vhosts/i-xxxxxxxx/wp-content/plugins/staticpress-s3/includes
$ sudo cp class-S3_helper.php class-S3_helper.php.org
$ sudo vim class-S3_helper.php
/*188行目あたり
$magic_file = '/usr/share/misc/magic';
をコメントアウトまたは削除し、追記する*/
$magic_file = '/usr/share/percona-server/magic';
###class-static_press.phpの修正
画像つきの投稿を新規作成するとうまく動かない事象への対処です。
$ cd /var/www/vhosts/i-xxxxxxxx/wp-content/plugins/staticpress/includes
$ sudo cp class-static_press.php class-static_press.php.org
$ sudo vim class-static_press.php
/*730行目あたり
if (is_wp_error($permalink))
continue;
の後に追記する*/
if (preg_match('/.*\.html\/.*/', $permalink, $m)) {
continue;
}
##パーマリンクの設定
- [設定] -> [パーマリンク設定]
- カスタム構造を選択し、**
/%postname%.html**を入力する - [変更を保存]をクリックする
##StaticPress S3の設定
- StaticPress設定を開く
- 静的サイトURLにS3バケットのWeb公開URL(独自ドメインをもっていない場合は、S3バケットのEndpoint)を入力する
- 出力先ディレクトリの最後尾に**
static/**を追加する - [設定を保存]をクリックする
- S3バケットのIAM Access Keyを入力し、リージョンを選択する
※ 東京リージョンはAP_NORTHEAST_1 - [変更を保存]をクリックする
- S3 Bucketが選択できるようになっているので、同期先のバケットを選択する
- [変更を保存]をクリックする
#記事を投稿する
管理画面から新規記事を投稿します。写真入りの記事が望ましいです。
#コンテンツを同期する
- [StaticPress] -> [再構築]
- [終了]と表示されたら同期完了
■「エラー！」と表示された場合のトラブルシューティング
・class-S3_helper.phpの修正部分を見直す
・StaticPress S3の設定を見直す
・S3バケットのIAM Access Keyを作りなおす
・サーバのstaticディレクトリを削除する(次項参照)
- S3バケットのWeb公開URLにアクセスしてブログサイトが表示されることを確認する
#コンテンツを更新する
記事の投稿など、コンテンツを更新した際は都度「再構築」を実行する必要があります。
ただし、テーマの変更など大きくコンテンツが変更された場合など、同期がうまくいかず「エラー！」と表示されることがあります。
その時は、下記コマンドでサーバのstaticディレクトリを削除してから「再構築」を実行してみましょう。
※ i-xxxxxxxxは、AMIMOTO AMIインストール時に指定したインスタンスID。i-まで入力してTabキーで補完してもよい
$ sudo rm -rf /var/www/vhosts/i-xxxxxxxx/static
#WordPressサーバを停止してみよう
WoudPressサーバを停止してもS3バケットのWeb公開URLに正常にアクセスできれば、落ちないWebサイトの完成です！(ブラウザキャッシュの影響を排除するために別のブラウザを使って確認した方が良いでしょう) もし、画像等一部コンテンツが欠落するようなら、Webページのソースを調べて、オリジンの絶対パスの記述がないか確かめます。
※ EC2でElasticIPをアサインしていない場合、サーバ停止 -> 起動でグローバルIPが変わりますので注意して下さい。IPが変わってしまった場合は、DNSのレコードを修正する必要があります
##サーバの停止
Elastic IP(固定IP)を設定していない場合はIPアドレスが変わります
- AWS ConsoleでEC2を開く
- 左ペインの[Instances]をクリックする
- 停止するインスタンスの上で右クリック -> [Instance State] -> [Stop]
※ 起動する場合は[Instance State] -> [Start]
- [Yes, Stop]をクリックする
