WordPressをヘッドレスCMS化した話

このたび長年放置していたWordPressサイト(このサイトではない)をヘッドレス化することにしました。

WPのヘッドレス化に至った理由としては、

  1. FSEまで付き合ってきたものの、自分はブロックエディタが好きになれなかった
  2. そもそもphpにあまり詳しくないので何かと面倒くさい
  3. セキュリティ上の懸念。

と、この辺が主です。

わざわざWordPressをヘッドレス化しなくても、microCMSをはじめ色々なサービスがありますが、

  1. 画像の処理とかプラグインである程度やってくれるのは正直楽。
  2. 元データ(記事の原稿。Pugで書いてます)を一部紛失。いちいちWP記事をMDとかに変換するのも面倒くさい。
  3. もともと放置していたサイトなので、そこまで手をかけずに済ませたい

上記の理由から、コンテンツはWPで管理してフロント部分は別に用意することにしました。

以下やったことです。

フロント部分の作成

WordPressのREST APIから必要なデータを取得してコンテンツを作成。

詳細は省きます。

そんなに凝ったUIにしていた訳ではないのであまり時間もかけず作りました。

メディアファイルの保存先を変更

セキュリティ面を考えると、できるだけWPサイトのURLを隠したいところです。

もちろん完全に隠匿することはできないのですが、WPサイトのURLがむき出しになってしまうメディアファイルだけでも何とかしようと思い保存先を変更しました。

詳細は画像ファイルの保存先をサブドメインに変更する に書いています。

REST APIの公開を制限する

テーマやプラグインの設定で禁止していない限り、WordPressのREST APIは公開されており、あらゆるサイトからのリクエストが許可されます。

それは意図的な設計らしいですが、他サイトに公開する必要もなかったのでrest_pre_dispatchフックでAPIの設定を上書きしました。

詳細 →WordPress REST APIを特定のサイトにのみ許可

ヘッドレス用の新しいテーマを作る

WordPressをヘッドレス化するので、何も出力しないテーマを作ります。

必要なものは、

  • style.css(必須。WPテーマを識別するためのファイル)、
  • index.php(中身のない空ファイル)、
  • functions.php(必要なものだけ記述)

の3ファイルだけです。

テーマをアップロード&有効化すると、何も表示しないWPサイトのできあがり。

雑感・まとめ

重い腰をあげて挑んだ割に、やってみたら意外とすぐに終わったのでほっとしています。

ですが、プラグインやテーマの独自機能への依存度が高いサイトだと、かなり大変な作業となりそうです。

そういう意味では、WPのヘッドレス化に向いているサイト、向いていないサイトとに分かれます。今回は「非常に向いているサイト」でした。

この記事で書いた手順は最小限で済んだ幸運な例ですが、どなたかの参考になりましたら幸いです。

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