HerokuとWordPressとMySQLで苦しんだ話

結論

Heroku+WordPress、無料でできて嬉しそう！と思って始めましたが、個人的には2020年現在そこまでおすすめできる方法でもないです。
でも安く収まる、うまくいけばほぼ無料でできるのはそうなので、メリットデメリット考えて選ぶことはできる……のかも。

テンプレートを探す

GitHub – mhoofman_wordpress-heroku_ Template project for deploying WordPress to Heroku

GitHub – PhilippHeuer_wordpress-heroku_ This project is a template for installing and running WordPress 5.x on Heroku.

GitHub – shimoju_wordpress-heroku_ WordPress on Heroku

このようなテンプレートがGitHubにあるのでお借りすると比較的簡単にHeroku上でWordPressを使うことができる……はずですが、なかなか新しいものはなく、そのまま使おうとするとWordPressのバージョンをあげるだけでちょっと大変だったりします。
参考にする分には非常にありがたいです。

Composerを使う

WordPress自体のアップデートやPluginの更新をサクサク行うためにComposerを使用しました。

こんな感じのcomposer.jsonを使っています。

{
  "require": {
    "php": "^7.4",
    "johnpbloch/wordpress": "^5.4",
    "vlucas/phpdotenv": "^5.0",
    "ext-gd": "*",
    "ext-mbstring": "*",
    "ext-pgsql": "^7.4",
    "ext-mysqli": "^7.4",
    "wpackagist-plugin/amazon-s3-and-cloudfront": "*",
    "wpackagist-plugin/amazon-polly": "*",
    "wpackagist-plugin/wp-sendgrid": "*",
    "wpackagist-plugin/contact-form-7": "*",

　　（略）

  },
  "extra": {
    "installer-paths": {
      "wp/wp-content/plugins/{$name}/": [
        "type:wordpress-plugin",
        "type:wordpress-muplugin"
      ],
      "wp/wp-content/themes/{$name}/": [
        "type:wordpress-theme"
      ]
    }
  },
  "repositories": [
    {
      "type": "composer",
      "url":"https://wpackagist.org"
    },
    {
      "type": "composer",
      "url":"https://packagist.org"
    }
  ],
  "scripts": {
    "wp": [
        "composer update",
        "cp -r wordpress/ wp/"
    ]
  }
}

scripts に wp というコマンドを設定しておくことで、WordPress本体に更新があったときに（なくても行われてしまいますが）自動的に自分の wp フォルダ内にコピーしてくれる設定にしました。
composerで持ってきたwordpressフォルダをそのまま使わないのは、追加で置きたいフォルダがあったりするときに対応できるようにです。

pluginとthemeはここで探すことができます。
WordPress Packagist

特にpluginの数が増えてくるとcomposerが遅くなるので（フランスが遠い）、

composer config -g repos.packagist composer https://packagist.jp

コマンドラインからこのように設定して、Packagist●JP というミラーサイトを使わせていただくことをお勧めします。劇的に早くなります。

MySQLかPostgreSQLか

Herokuには無料のMySQLとPostgreSQLのデータベースのAdd-onがあるので、それを使ってWordPressのデータを保存できます。
MySQLが使えるClearDB MySQLの容量が5MBと結構小さめで、私のサイトは初期段階からオーバーしてしまいました。最安プラン($9.99/月)でも課金すれば1GBになるので余裕。
一方10,000行まで保存できるHeroku Postgresの方がだいぶ安心ですが（コンテンツ多くなると足りなくなりそうだけど）、WordPressは基本がMySQLなので一手間かかります。
PG4WP を使うとPostgreSQLをMySQLに書き換えてくれるので、基本的な機能はほぼ使えるようになります。
ただ、WordPressの諸々のPluginを使いたかったときにその部分の書き換えがうまくいかず、結局MySQLを使うことにしました。Herokuのアドオンよりはもう少し安くしたいなあ。ということで画像や動画などのデータ置き場に使おうと思っていたAWSのAmazon RDSではじめることにしました。MySQLもPostgreSQLも使える。
料金は、Amazon RDS for MySQL で1GiB使えるdb.t3.microにすると$8.76/月。劇的ではないけどこっちのがちょっと安いのでひとまずこれで。
というわけでこの部分は無料ではないです。

Amazon S3にデータを置く

WordPressはブラウザ上で記事を書いたり画像を上げたりするのが簡単にできるのが魅力ですが、Herokuは一定時間が経つとコミット時の状態に戻ってしまうのでその点で相性がよくありません。文字情報はデータベースに保存されますが、画像や動画など、データを保存するためには、それ専用の場所が必要です。
私はAmazon S3を使うことにしました。
これに関しては、少ない容量ならばほぼ無料で使うことができます。数円程度はかかるかもしれません。
先ほど、composer.json内に以下のように書きましたが、「WP Offload Media Lite for Amazon S3, DigitalOcean Spaces, and Google Cloud Storage」というプラグインを使って設定してあげることで、WordPressからブラウザ上でアップロードした画像が自動的にAmazon S3に収まってくれます。

"wpackagist-plugin/amazon-s3-and-cloudfront": "*",

私は、このプラグインを使おうとしたときにPG4WPを使ったPostgreSQL変換がうまくいかなくなってしまいました……。

参考リンク

WordPress + Heroku + PostgreSQL + Amazon S3 = ¥0 _ _ Workabroad.jp

そのほか

HerokuでRDSを使ったら遅かった

データを更新したり、リロードボタンを押すだけで気が狂いそうなほどの待ち時間が発生したのでその待ち時間中に解決法をググりました。

RegionがTokyoだったのが原因でした。それはそう。
Herokuのサーバーに近づけましょう。

一度 Tokyoだった Regionを Virginiaに変更することはできないので下記のリンクを参考にデータを移し替えて新たに作成しました。

[SOLVED] how to copy_move AWS RDS to another Region _ by Dani Shulman _ Medium

結論