AWS x Heroku x WordPress：ほぼ無料でブログの設定

まえがき

気ままなペースでブログを書き始めたいと思い、極限までお金を使わずブログの設定を行った。（最初は投稿数、また閲覧者数も多くならない事を見込んだため）２年ほど前にほぼ同じ方法で設定済みであったが、放置されていたため、勉強もかねて再設定。案の定色々はまりまくったので覚え書きとして手順（箇条書きで設定の詳細は省く）やうまく行かなかった所などをここに記述する。

約２年ほど前、WebサイトなどもHerokuを利用しようと考えていたのでHeroku でWordPressのブログを運用できないか調べていたところ下記のサイトに行き着いた。https://qiita.com/fuwamaki/items/8684003bb47197336645

ここで紹介されている”時間をかけて構築する方法”で当時問題なくブログの設定ができたはずだが（もしかするとその時も色々はまっていたかもしれない）、今回は色々苦戦。

ここからはHerokuとAWSのアカウントがすでにある事を前提で進める。

1. ローカルでデプロイの準備

好きな階層でGitの設定をする。
すでにWordPressのデプロイ先の（空の）アプリをHerokuで作成している事を前提でHerokuのdeployの手順に従い下記のコマンドでローカルで設定を行う。

$ heroku login // Herokuにログイン
$ heroku git:clone -a "アプリ名" //Herokuのアプリをクローン（この時点では空）
$ cd "アプリ名" //新たに作成されたディレクトリに移動

次に後で紹介するHeroku上でWordPressを使えるようにするプログラムでcomposerを使うため、composerをインストール。

$ brew install composer

＊はまった点-１
composerは新しいバージョンを使うとエラーが出たため下記のコマンドでダウングレードした。

$ composer self-update --1

その後WordPressをHerokuで動かせるようにするプログラムをディレクトリ内にクローン。

$ git clone https://github.com/PhilippHeuer/wordpress-heroku.git

その後下記コマンドでcompose.json内で指定されたライブラリなどをインストールする。

$ composer install

＊はまった点-2
その後WordPressのプラグインやテーマはcomposer.jsonで指定してcomposer updateのコマンドでインストールするという流れみたいだが、それをして再度デプロイするとHerokuのアプリがクラッシュしてしまう事が多発。追加した項目を消去して再度composer updateしてデプロイしてもクラッシュし続けたため、composer installは一度だけ行うようにして、下記のサイトを参考にプラグインやテーマはcomposerを通さず直接ダウンロードしたファイルを所定の場所に置くことにした。

https://dev.to/aryaziai/complete-guide-to-hosting-wordpress-on-heroku-with-ssl-certification-4f2l

＊はまった点-3
使用したWordpress-herokuのプログラムで使用されていた（composer.jsonに記述されていた）S3 uploadsというプラグインではAWSのS3とのコネクションは確立できたが（WordPressでアップロードした画像がS3のストレージに保存される）画像が全て0バイトで保存されるという問題が起こる。AWS側の設定を疑い色々試すもうまくいかず、結果S3にWordPressから画像をアップロードするのに異なるプラグインを使用。WP Offload Media Liteがよく使われてそうだったが、これを何度か試したが上手くいかず。結果下記のサイトを参考にしてWasabi Smart File Uploadsを使用。https://preventdirectaccess.com/docs/upload-wordpress-files-directly-to-amazon-s3-bucket/ 
よってcomposer.jsonに記載されているS3 uploadsのプラグインはcomposer.jsonから削除。

他Herokuの設定ファイルをSecretにしたり、追加インストールなどあるがこれは下記のサイトで紹介されている通りのため割愛。https://qiita.com/fuwamaki/items/8684003bb47197336645

*S3 Uploadsは使用していないため、Herokuのconfigでストレージへの接続設定はせず。

これでローカルでの設定は一旦完了したためgitにて変更をコミットしてHerokuのアプリ（リモート）にプッシュ。

＊はまった点-4
Herokuで新たにアプリを登録した時に使用されているHeroku-22-stackのままだとデプロイ時にエラーが起こった。そのため下記のコードでダウングレード。

$ heroku stack: set heroku-18

2. AWSでの設定

AWSにアカウントがある事が前提でまずS3でバケットを設定し、その後IAMでユーザーの登録。
S3とIAMの設定はこちらのサイトとほぼ同じ。https://qiita.com/fuwamaki/items/8684003bb47197336645

*S3のバケットの設定はパブリックアクセスを許可にした。これについてはどれがいいのかまだよくわかっていないがブログで使う画像のみの保存のため、特にアクセスがあっても問題がないと判断。
*S3への接続に異なるプラグインを使用予定のため他のバケットの設定はこちらを参考にした。
https://preventdirectaccess.com/docs/upload-wordpress-files-directly-to-amazon-s3-bucket/

3. WordPressのインストール

Heroku側でアプリを開くとWordPressのインストール画面に。ユーザー名、パスワード、メールアドレスを登録するとログイン可能に。ログイン後、Wasabi Smart File Uploadsのプラグインの設定が可能に。これをこのサイトにしたがって設定。
https://preventdirectaccess.com/docs/upload-wordpress-files-directly-to-amazon-s3-bucket/

設定を進めていくとwp-configファイルに追記する情報が表示される。
これを再度ローカルで設定し、デプロイ。追記する情報のaccess-keyとaccess-secretはAWSのIAMで指定したもの。bucket regionに関してはどう記述するか迷ったが（end pointなどもあるため）、自分の場合はヨーロッパ（フランクフルト）でeu-central-1で上手くいった。（これ以外を使用するとWorldPressがクラッシュ）

あとがき

今回細かなところは割愛して（上手くいかなかったところを明記しながら）ざっとAWS x Heroku x WordPressを使用してほぼ無料でブログの設定をする流れを紹介した。はまった箇所は自分のMac OSのバージョン（10.13.6）やインストールされているPHPのバージョン（8.1.10）など色々な要因も考えられるため別の環境で同じような問題が起こるかはわからない。今回いろいろ詰まって調べたおかげで仕組みがよくわかったが、AWSの設定などはまだまだ勉強が必要そう。