XserverにあるワードプレスをNext.js＋Vercelでヘッドレス化した際に起きた403エラーの解決方法

WordPressをヘッドレスCMS化して、フロントをNext.js＋Vercelで構築している時に、ローカルでは普通に動くのにVercel上でのビルドだけ毎回失敗するという現象にハマった。原因究明に時間がかかったので、同じ沼にハマる人向けに記録しておく。

症状

npm run build の中で、特定のページ（お問い合わせページ）を静的生成（SSG）する際にエラーで止まる。

SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

WordPressのREST APIから記事データを取得しているのだが、返ってきたのはJSONではなくHTML。

しかも手元のPCから同じURLにcurlでアクセスすると、普通にJSONが返ってくる。「ローカルでは成功、Vercelのビルドでだけ失敗する」という、再現性はあるのに原因がつかみにくいタイプの不具合だった。

疑ったもの（結果的にどれも違った）

• セキュリティプラグイン（All In One Security）のFirewall（6G/7G）→ 元々OFF
• 同プラグインのBlacklist Manager（手動IP拒否リスト）→ 登録なし
• Xserverの「アクセス拒否設定」（IP拒否リスト）→ 登録なし
• Xserverの「WAF設定」→ OFF
• .htaccess → WordPress標準のリライトルールのみ

一通り確認したが、どれも空振り。ここで大事だったのは、推測で設定を1つずつ疑うより、実際に何が返ってきているかをログに出して直接見ることだった。一時的にfetch処理へデバッグログを仕込んでVercelにデプロイし、ビルドログで生のレスポンスを確認したところ──

status=403 content-type=text/html
<!DOCTYPE html>
...
<meta name="copyright" content="Copyright XSERVER Inc.">

Xserver自体が返している403ページだと判明した。WordPressやプラグインより手前、サーバーインフラ側でブロックされていたのだ。

真の原因：Xserverの「国外アクセス制限」

Xserverのサーバーパネルには、WordPress専用のセキュリティ設定（AIOSなどのプラグインとは別物）があり、その中に「国外アクセス制限設定 → REST APIアクセス制限」という項目がある。これがON（デフォルトで推奨設定）になっていた。

VercelのビルドサーバーはアメリカのIPからアクセスしてくるため、この制限に引っかかり、REST APIへのアクセスだけが海外IPとしてブロックされていた、というオチだった。手元のPC（国内）からの確認では再現しないのも当然である。

対処：サーバーパネル→「WordPressセキュリティ設定」→「国外アクセス制限設定」タブ→「REST APIアクセス制限」のみを「OFFにする」で解決した（ダッシュボードアクセス制限などは引き続きONのままでよい）。

まとめ

• Vercel・Netlifyなど海外ホスティングからWordPressのREST APIを叩く構成では、ホスティング側の「海外IPアクセス制限」の存在を疑うべき
• 原因切り分けに迷ったら、推測で設定を順番に疑うより、実際のレスポンス内容をログに出して直接確認する方が早い
• .htaccessや各種プラグインの設定を見ても分からない「403」は、サーバーインフラ側の機能も疑う