記事公開や更新時の「返答が正しいJSONレスポンス…」解決法まとめ

ワードプレスで記事を書いて公開する時、また、修正して更新する時に表示されるエラーに「返答が正しい JSON レスポンスではありません。」というものがあります。

解決するのに結構な時間がかかりましたが、私の場合、これまでプラグインが原因だったものとPHPでショートコードを自作していた時の2つのケースがあります。

ここではその２つについての解決法と、その過程で色々調べたその他ケースの解決法全体まとめを備忘録として残しておきます。

Contents

1 エラーの現象１：プラグインが原因
2 エラーの現象２：ショートコード
3 原因といくつかある解決法
4 まとめと補足

エラーの現象１：プラグインが原因

ワードプレスの環境

参考までに、問題解決したブログの動作環境を書いておくと以下の通り。（エラーが表示されるときの環境）

サーバー：エックスサーバー
ワードプレスのバージョン：WordPress 5.5.3
テーマ：Cocoon
パーマリンク：投稿名
.htaccess：常時SSL化のためのコードを追加済
使用プラグイン：Broken Link Checker、Contact Form 7、Easy FancyBox、Jetpack、No Self Pings、Redirection、Simple Custom CSS and JS、Smush、Throws SPAM Away、TypeSquare Webfonts for エックスサーバー、UpdraftPlus、User Role Editor、WP External Links、WP Fastest Cache、WP Multibyte Patch、Yoast Duplicate Post

実際のエラー

それまで何ともなかったのに、ある時から突然、新たに記事を作成して公開する時や下書き保存、更新、をする時に「返答が正しい JSON レスポンスではありません。」とエラーが表示される。

エラーが表示され、え？と思って記事一覧とか表示しようとすると「行った変更が保存されない可能性があります」とか表示される。

変更が保存されない可能性がある、とか言われてもどうしようもないので「このページを離れる」をクリックして一旦編集を抜けてまた投稿一覧から編集に入ってみると、実際には記事の公開や更新、下書き保存はできている。

ワードプレス自体は問題なく動作しているけど、エラーが表示されて気持ち悪い、みたいな、「なんだろう、このエラー」という感じです。

プラグインをまず疑え

「返答が正しい JSON レスポンスでは...」のエラーは、ネット上で調べてみるとその原因は主に「.htaccess」にあるようです。（詳しい調査結果は下方にまとめてます）

そうしたものを色々見て試してみましたが、私の場合、全て効果なし。

そこでエラーが起きた時の対処法としては超基本となる、プラグインを一旦全て無効化（停止）としてみたところ、あら不思議、エラーが表示されなくなりました。（ものすごく嬉しい（笑））

原因は「WP External Links」というプラグイン。

このプラグインは、記事内などにある外部リンク（別サイトへのリンク）、内部リンク（自サイトの記事へのリンク）がクリックされた時に、ブラウザの同じタブで表示するか、別のタブで新たに開いて表示するか、といった動作を決められるもの。

このプラグインをOFF（無効化）したところ、「返答が正しい JSON レスポンスでは...」のエラーが出なくなり、普通に記事の公開や更新ができるようになりました。（やったね！）

エラーの現象２：ショートコード

自作で関数やショートコードを作る人はここではまるかも。

WP_Queryを使ったショートコードでJSONレスポンスエラー

その後何か月後になるのか、ワードプレス用にPHPで独自のショートコードを作っていた時のこと。

ショートコードで記事の一覧を表示させようとしていた時に、再びこのエラーが再来。

下書きに記事の一覧を表示させる自作のショートコードを貼り付けプレビューで動作チェックをする、みたいなことを繰り返してましたが、ある時から下書き保存でこの「返答が正しいJSONレスポンスではありません」が表示されるようになりました。

この時も、プレビューではショートコードは動作しているようですが、エラーがでるとやはり気持ち悪い。

実際のコードは以下のように、WP_Queryを使って記事一覧の表示でしたが、ショートコード作成の超基本をすっかり忘れていたのが原因。

<?php 
function test(){
global $post;
$paged = get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1;
$args = array(
'post_status' => 'any',
'paged' => $paged,
'posts_per_page' => 5
);
$query = new WP_Query($args);
if ( $query->have_posts() ) :
while ( $query->have_posts() ) : $query->the_post();
echo $post ->post_title.'<br>';
endwhile;
endif;
wp_reset_postdata();
//ページペーション
$big = 999999999;
$args	= array(
'base' => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),
'current' => max(1, get_query_var('paged')),
'total' => $query->max_num_pages,
);
echo paginate_links( $args );
}
add_shortcode("test_check", "test");
?>

<?php

function test(){

global $post;

$paged = get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1;

$args = array(

'post_status' => 'any',

'paged' => $paged,

'posts_per_page' => 5

);

$query = new WP_Query($args);

if ( $query->have_posts() ) :

while ( $query->have_posts() ) : $query->the_post();

echo $post ->post_title.'<br>';

endwhile;

endif;

wp_reset_postdata();

//ページペーション

$big = 999999999;

$args = array(

'base' => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),

'current' => max(1, get_query_var('paged')),

'total' => $query->max_num_pages,

);

echo paginate_links( $args );

}

add_shortcode("test_check", "test");

ある時から、$args の変数を少しでも変えたりすると「JSONレスポンスエラー」が表示されるようになり、WP_Queryの使い方に問題があるのかとか、PC上でXAMPPを使って試していたので環境的な問題なのかなどなど散々さまよいましたが、ポイントはショートコードにありました。

上のコードで echo を使ってますが、ショートコードの基本として echo を使うのではなく return で返す、というのをすっかり忘れていたことからエラーになっていたようです。

<?php 
function test(){
global $post;
$paged = get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1;
$args = array(
'post_status' => 'any',
'paged' => $paged,
'posts_per_page' => 5
);
$query	= new WP_Query($args);
$html	= '';
if ( $query->have_posts() ) :
while ( $query->have_posts() ) : $query->the_post();
$html .= $post ->post_title.'<br>';
endwhile;
endif;
wp_reset_postdata();
//ページペーション
$big = 999999999;
$args	= array(
'base' => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),
'current' => max(1, get_query_var('paged')),
'total' => $query->max_num_pages,
);
$html .= paginate_links( $args );
return $html;
}
add_shortcode("test_check", "test");
?>

<?php

function test(){

global $post;

$paged = get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1;

$args = array(

'post_status' => 'any',

'paged' => $paged,

'posts_per_page' => 5

);

$query = new WP_Query($args);

$html = '';

if ( $query->have_posts() ) :

while ( $query->have_posts() ) : $query->the_post();

$html .= $post ->post_title.'<br>';

endwhile;

endif;

wp_reset_postdata();

//ページペーション

$big = 999999999;

$args = array(

'base' => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),

'current' => max(1, get_query_var('paged')),

'total' => $query->max_num_pages,

);

$html .= paginate_links( $args );

return $html;

}

add_shortcode("test_check", "test");

そうだ、echo は使っちゃだめで return で返すんだったと気が付くまでに何時間使ったことか．．．

行13で表示するHTMLの変数 $html を作って、HTMLで表示させたい個所（echo で表示させていた箇所）はすべてそこに入れる。（17行目、30行目）

最後（32行目）に return で $html を返すようにすると、見事「JSONレスポンスエラー」が消えてくれました。（涙が出るくらいうれしかった笑）

原因といくつかある解決法

私の場合はプラグインや自作ショートコード中の echo が原因でしたが、「返答が正しい JSON レスポンスでは…」のエラーついて、対処法を調べた結果を備忘録としてまとめておきます。

原因はそもそも何？

エラーに表示される「返答が正しい JSON レスポンスでは…」の意味ですが、まず「JSON」は「JavaScript Object Notation」で、軽量にデータ通信を行うためのフォーマットの一種とのこと。

ワードプレスでは「wp-json」というものがあるようで、ワードプレスver5以上で搭載されたブロックエディターでは、「REST API」（Webシステムを利用するための呼び出しルール）というものを使ってこの「wp-json」と通信し、記事の更新とかをしているのだとか。

何を言ってるのかさっぱり分かりませんが（笑）、この説明からすると関係しそうなのがまず「ブロックエディター」と「REST API」。

それに加えてアクセス制御に関連するであろう「.htaccess」と私が遭遇したケースのようにPHPプログラム的問題の計4点。

１）ブロックエディター
２）REST API
３）.htaccess
４）PHP

ネット上を検索すると、JSONエラーは様々な要因により発生し、原因の特定が難しい、というものだそうですが、私が調べた範囲（と私のケースを含めて）では、大体この4つに関連して「返答が正しい JSON レスポンスでは…」のエラーになる、と集約できそうです。（あくまで私が調べた範囲ですけど）

対処法１）ブロックエディターを使わない

ワードプレスのブロックエディタがJSONと関連した動作をしている、それが原因、となれば、そもそもブロックエディタを使わない、という対処法があります。

つまり「ブロックエディタ」ではなく、ワードプレス５より前に使用されていた「クラシックエディタ」を使う。

これにはそれ用のプラグインを使うことになりますね。

クラシックエディタにするプラグイン
- １）Classic Editor
- ２）Advanced Editor Tools (previously TinyMCE Advanced)

１の「Classic Editor」プラグインは、ワードプレスがバージョン５になりブロックエディタが導入された時、以前の使い勝手が良い人（クラシックエディタが良い人）向けに期間限定として提供されたもの。

確かその内更新がとまる、という前提で開発されたもので、あまりおすすめはできない。

ということで、代わりに「Advanced Editor Tools (previously TinyMCE Advanced)」というプラグインを使うのが良さそうです。

このプラグインの設定に「上級者向け設定」があり、その中にある「ブロックエディターをクラシックエディターに置き換える」にチェックを入れて設定保存すればOK。

でもこの対応、クラシックエディタの経験がある場合は良いですが、新たにブログをはじめ、そもそもブロックエディタからワードプレスに入っている人には少しツライ対応になりそうです。

私の場合、もともとはクラシックエディタを使っていたのでこの対応でも良かったですが、これからはブロックエディタがより進化していくことになるので、古いエディタに戻りたくないし（ブロックエディタ内にもクラシックディタを使うためのブロックも用意されているし）、今ではブロックエディタの方が断然使い勝手が良い、と感じているので、この対応はしませんでした。

対処法２）REST APIに関連してWAFの設定

REST API（Webシステムを利用するための呼び出しルール）が関係している、となると、そこに関連するのがWAFの設定。

WAFとは「Web Application Firewall」で、外部からの不正な侵入など防ぐファイアウォールと呼ばれるものの１つですが、ワードプレスがREST APIを使用して wp-jsonと通信しながら記事の更新などをする関係上、その通信時に「これは何か怪しい通信かも」とWAFが感知すると JSONエラーになるようです。

対処としては、ワードプレスの運営者（つまり自分）がワードプレスで記事の編集や公開をする場合には「WAF君は働かなくても良いよ、怪しいことしてないからね」、という設定をすること。

設定は、.htaccess に以下を追加する、ということのようですね。

#ブロックエディタエラー対策 start--------
<IfModule mod_siteguard.c>
SiteGuard_User_ExcludeSig ip(xxx.xx.xxx.xxx)
</IfModule>
#ブロックエディタエラー対策 end--------

#ブロックエディタエラー対策 start--------

SiteGuard_User_ExcludeSig ip(xxx.xx.xxx.xxx)

</IfModule>

#ブロックエディタエラー対策 end--------

※）ip(xxx.xx.xxx.xxx)には、自分のIPアドレスを調べてそれを記載する。

詳しくは以下の記事を参照してみてください。

この対処法を見た時、「これだ！」と思いましたが、そもそもWAFの設定はロリポップでは良く聞くトラブルの元（コンサル生からプラグインの設定更新ができない、と相談があると、ロリポップのWAF設定が原因という場合が何度もあった）。でも私が使っているのはエックスサーバー。

エックスサーバーでWAFの設定してたかな？と改めて見てみると、エックスサーバーにもWAFの設定がしっかり用意されているのを今回の件で初めて認識しました（笑）。

でも実際その設定を見ると全てOFFになっていて、この対応は私の場合には適用できない。

IPアドレスはプロバイダー（契約しているインターネット接続サービス）によって不定期で変わる場合もある。

また、そもそもエラーの出ているブログは外注さんにも使ってもらうもの（流動的な複数人が使用する想定のもの）なので、仮にこの対応でエラー表示がなくなっても、ブログの運用上、管理が結構つらそう。

これなら、いっそのこと対処法１のクラシックエディタにする、という方がまだ良いかもしれない。

対処法３）.htaccessの確認

「.htaccess」はサーバー上の設定でアクセス制御に関するものを記述するファイルですが、この「.htaccess」が空欄になっている、とか、余計な空行が入っているなどで「JSONレスポンスエラーが表示される」ということがあるようです。

単に記事を更新していくだけのブログを運営しているよ、という場合には、常時SSL化するためのコードを追加する以外、基本的に自分で編集したりすることはない。
（リダイレクトを設定したり、さっき出てきた REST APIなどのアクセス制御をしたい、という場合が出てきたら編集して使う、といった結構上級者向けのもの。常時SSL化については「ブログやサイトの常時SSL化の詳細手順！誰にもわかる４つのステップで簡単にSSL化する方法」を参照）

でも実際には自分の知らないところで「.htaccess」の中身は編集されます。（以下例を挙げてみると．．．）

サーバー上の設定変更
- アクセスに関連するサーバー上の設定を変えると、「.htaccess」の内容に追加や削除が起きる
- エックスサーバーで言えば「ダッシュボードアクセス制限」や「REST API アクセス制限」の設定など。
- その他キャッシュに関わるサーバー上の設定の変更すると、「.htaccess」の内容に追加や削除が起きる
パーマリンクの設定変更
- ワードプレスのパーマリンクの設定を「基本」以外に変える、または「基本」に戻すと、ワードプレスが「.htaccess」を編集する
各種プラグインの有効化／無効化
- たとえばセキュリティ系のプラグインを導入する等、アクセスに関係するプラグインを有効化すると、プラグインが「.htaccess」に対して設定を書き込む
テーマの設定変更
- アクセスに関わる設定を変更すると、その設定変更に合わせてテーマ自体が「.htaccess」に対して設定を書き込む
- 例えば Cocoonでは「サイト高速化」設定にある「ブラウザキャッシュの有効化」をONすると「.htaccess」に多くの記述が書き込まれ、OFFにすると、その記述が削除される

こうしたところで「.htaccess」に対して知らない間に編集が起き、更に何らかの理由からその編集が正しく行われず、たとえば「.htaccessの中身がなくなった」（空欄になった）なども起きることがあるようです。

ネット上でJSONレスポンスエラーの解決法を見ると、たとえば、

.htaccessが空欄になっていた⇒ワードプレスの設定を貼付け
- ワードプレスで保存すると「返答が正しい JSON レスポンスではありません」となり見出しが自動下書きとなる現象に対処
- .htaccess内のワードプレスの設定が空欄になっていたのを解消
- パーマリンク設定を変更したのが原因
パーマリンク設定を再保存したらエラーが解消
- トラブル事案｜WordPressでエラー「返答が正しいJSONレスポンスではありません」
- パーマリンクを再設定してエラーを解消
テーマの設定のし直しでエラーを解消
- 【WordPress】「返答が正しいJSON レスポンスではありません」エラー対応した話
- Cocoon使用の例で、高速化の設定にある「ブラウザキャッシュの有効化」をオフしてキャッシュも削除。その後再びONに設定しなおしエラーを解消した例

パーマリンクの設定し直しにしても、テーマの設定のし直しにしても、つまりは .htaccess の中身が正しくなく、設定のし直しにより.htaccessの中身が改めて書き直されて正常になったため、JSONレスポンスエラーが出なくなった、と解釈できそうです。

.htaccess の中身の確認ですが、そもそも見ても「本来どうあるべきか」といった記述内容が分からないため、確認しても意味がないみたいにも思えますが、まずは以下の手順で対応するのが良いと思います。

事前）.htaccessの中身の確認法
- エックスサーバーでは、「サーバーパネル」ログイン後、「ホームページ」の項目内に「.htaccess編集」というメニューがあるのでそこをクリック。
- 画面上、「.htaccessの編集が行えます」の下に「.htaccess編集」というタブがあるので、そこをクリックすると .htaccessの内容が見れます（その場で中身の編集もできる）
１）.htaccessのワードプレス部分の記載が空欄になっている場合
- パーマリンク設定が「基本」であれば、多分そのままでも良いが、「基本」以外（投稿名など）になっている場合には、一度設定をしなおしてみる。
- それでもワードプレス部分の記載が空白の場合には、ワードプレスが基本として書き込む内容をコピペしてみる
- ワードプレスが.htaccess に書き込む基本形はワードプレスの公式サイト「htaccess | WordPress.org 日本語」内の「WordPress の基本形」参照
２）.htaccessのワードプレス部分は問題なさそうな場合
- パーマリンクの設定に対して、特に変更せずに保存してみる
- テーマ内の設定でブラウザキャッシュの有効化など、アクセスに関連する設定があれば、一度OFFしてみる
３）キャッシュのクリア
- １）や２）の設定変更でエラーが解消されない場合、一度ブラウザのキャッシュをクリアしてみる