「更新に失敗しました。 返答が正しい JSON レスポンスではありません。」というエラーの解決方法

WordPress の投稿画面を保存しようとしたところ、「更新に失敗しました。 返答が正しい JSON レスポンスではありません。」というエラーが表示され、保存ができなくなってしまいました。

ウェブ上には同じ状態の解決方法が複数存在しているものの、いずれもエラー解消には至りませんでしたが、エラーメッセージや環境を変えてトライしたところ解決できました。

同じ状況になった場合の参考として、残しておきます。

ある日突然保存できなくなってしまった

2023/09/21投稿を保存しようとすると、冒頭のエラーが表示され、突然記事が保存できなくなってしまいました。1週間程度前は何も問題ありませんでした。

変更した点といえば、利用しているプラグインの更新くらいしか思いつきません。これは困りました……。

調べると、この「返答が正しいJSONレスポンスではありません」というエラーの原因は一つに限らず、様々な要因が考えられるとあり面倒そうな印象です。

結論。原因はWAFだった

最初に結論から書くと、WAF（ウェブアプリケーションファイアーウォール）を無効化することでエラーは解消しました。

対象WordPressの設置サーバーはmixhostを使っており、mixhostではオープンソースのWAFであるModSecurityが導入されています。プランによってはWAFがないらしいです。今までずっとWAFを有効にして使っていたため原因に行き着くまでに少し時間がかかりました。

WAFの有効/無効はコントロールパネルから設定可能です。mixhostはCPanelを採用しておりわかりやすいのと、マニュアルにも設定方法が用意されているため簡単に設定できます。

WAF/ModSecurityの有効/無効を切り替える方法 – mixhost ヘルプ＆サポート

やってみたけど効果がなかったことや根本解決ではないこと

これで以上！となってしまうので、色々とやってみましたが効果がなかったり、一時的な解決にはなるものの根本的な解消にはならなかったことを以下にご紹介します。なお、本番環境ではなくテスト環境やローカルの開発環境で行いました。

プラグインの停止

一番最初に思いついたのは、この1週間で変化があったことといえばプラグインの更新くらいしか思いつきませんでしたので、全てのプラグインを無効化しました。

が、プラグイン無しの状態でも変わらずエラーでした。

テーマの変更

利用しているテーマの影響を考え、WordPressデフォルトテーマであるTwenty Twenty-Threeにテーマを変更しました。

しかし、これも変わらずです。

ブロックエディタからクラシックエディタに変更する

ブロックエディタで表示されるエラーとのことで、プラグインを使って以前のエディターであるクラシックエディタを有効としました。使ったのは5百万以上のインストールを誇るプラグイン、Classic Editorです。

確認すると、エラーが発生しません。ブロックエディタに影響がでているのは間違いなさそうです。ただし、将来的なことや運用の観点からブロックエディタを使い続けたいので、クラシックエディタを利用するという選択肢はありません。引き続き原因を探ります。

パーマリンクの設定変更

WordPressのパーマリンク設定を基本に変更することで、問題が解決されたという記事がいくつかありました。もともとは「カスタム構造」となっていたため、パーマリンク設定画面から「基本」を選択して保存します。

確認すると、エラーが発生しませんでした。ただし、この状態だとパーマリンク構造が変わってしまいます。他の設定である以下のパーマリンク構造に変更してみましたが、どれもエラーとなってしまいます。

• 日付と投稿名
• 月と投稿名
• 数字ベース
• 投稿名

結局エラーが発生しないのは「基本」のパーマリンクだけです。パーマリンク構造は変化させたくないので、この解決案も却下です。

.htaccessの設定変更

パーマリンクを「基本」に設定変更することで修正されるのであれば、パーマリンク設定を保存したときに更新される.htaccessの中身かもしれないと考え、サーバーにアクセスして中身を確認します。特に目立った部分はなさそうですが、キャッシュ系のプラグインやセキュリティ系のプラグインによっていくつか上書きされていたというのもあり、一度デフォルトの状態に戻して確認します。

パーマリンク構造は「カスタム」にした状態でパーマリンクをデフォルトの状態に変更して確認してみますが、これはエラーでした。

REST APIを無効化

ブロックエディタはREST APIが前提となるため、REST APIを無効化するという方法は取れないのですが、原因確認のため一時的に無効化してみます。無効化する方法は主に2つあって、テーマファイル内のfunctions.phpに書く方法と、プラグインを利用する方法です。

まずはテーマファイルに書く方法から。functions.phpに以下コードを書きました。

function disable_rest_api() {
    return new WP_Error( 'disabled', __( 'REST API is disabled.' ), array( 'status' => rest_authorization_required_code() ) );
}
add_filter( 'rest_authentication_errors', 'disable_rest_api' );

保存したあと、サイトURLの後ろに「/wp-json/wp/v2/」を付けてアクセスします。以下のような内容が表示されたら、REST APIが無効化されていることを確認できます。

{"code":"disabled","message":"REST API is disabled.","data":{"status":401}}

もう一つはプラグインの方法。Disable REST API プラグインを利用することで、REST APIを無効化できます。インストールして設定から、管理者権限も含めて全てのREST APIを対象に無効化します。

どちらの方法でもエラーは発生していました。よって、REST APIの有効無効は関係ありませんでした。

ローカル環境ではエラーが発生しなかった

環境の違いによる影響を考え、ローカルの開発環境でもエラーが再現するか確認しました。確認すると、エラー発生せず通常通り保存できました。

ということは、利用サーバーに起因すると考え、セキュリティ設定やサーバーキャッシュあたりではないかと思いました。

こちらはロリポップサーバーですが、同じエラーだったもののWAFを無効化すると解決したという記事を発見。

JavaScriptのエラーが発生していた

もう一度テスト環境に戻って、エラーが発生するタイミングでChromeのデベロッパーツールのコンソールを確認すると、

本番環境も同様のコンソールエラーが表示されており、エラーが発生しないローカルの開発環境ではこのコンソールエラーは表示されいませんでした。

403エラーなので読み込めてないのは何かしらブロックされているということで、この時点でWAFの可能性が高まりました。

mixhostのWAFは反映までに数分かかる

あとは冒頭に書いた通り、mixhostのWAFを無効化することで解消しました。

一点注意したいのは、WAFを無効化した後はすぐに反映されず、数分かかるということです。これだけ注意してください。

以上、エラー解決方法についてでした。同じ状況に置かれた人の参考になれば幸いです。

追記: mixhost カスタマーサポートから対応の連絡有り

mixhost のカスタマーサポートへ連絡していたところ、お返事をいただきました。やはりWAFが原因のようです。

とのことです。おそらくModSecurity側で該当のJavaScriptが403にならないように条件を変更する処理を追加されるのではないかと思います。

なお、本日時点でWAFを有効化した状態で記事の更新はエラーが発生していない状況でした。迅速なご対応に感謝です。また何かわかれば追記します。

追記: 修正完了の連絡有り

後日、mixhost のカスタマーサポートから修正対応が完了した通知がありました。

WAFを有効化した状態で更新してもエラーは出ませんでした。素早い対応でした！