---
title: "Next.jsマルチサイトアドオンのトラブルシューティング"
slug: "troubleshooting-the-next-js-multisite-add-on"
abstract: "マルチサイトアドオンを使ってNext.jsアプリの問題を調査・解決しましょう。"
---
# Next.jsマルチサイトアドオンのトラブルシューティング

このトピックでは、Next.jsマルチサイトアドオンに関する一般的な問題について説明し、可能な解決策を説明します。

## サイト解決のデバッグ

特定のドメインで解決されたサイトが期待通りでない場合は、JSSデバッグツールを使ってトラブルシューティングが可能です。

マルチサイトアドオンのデバッグを有効にするには:

1.  マルチサイト用の [デバッグログ](https://doc.sitecore.com/xp/ja/developers/hd/21/sitecore-headless-development/debug-logging-in-jss-apps.html "Debug logging in JSS apps") をオンにして、 sitecore-jss:multisite 名前空間を有効にしてください。
2.  必要に応じて、 DEBUG\_DEPTH 環境変数を使ってデバッグの深さを増やしてください。

デバッグログが有効になっていると、アプリのブートストラップフェーズで取得されたサイト情報をSitecore確認できます。 SiteResolverはこの情報を使ってホスト名に基づいてサイトを特定します。

また、各リクエストMultisiteMiddleware解決済みサイト名を含む詳細な情報を示すデバッグトレースログも確認できます。

## Vercel以外のホスティングサービス向けにNext.jsアセットのCORSエラーを解決する

Vercel以外のホスティングサービスを利用すると、Next.jsアセットリクエスト(<mysite>/\_next/static/<path>)に対してクロスオリジンリソースシェアリング(CORS)エラーが発生することがあります。

Next.jsアセットのCORSエラーを解決するには:

1.  PUBLIC\_URL環境変数を設定しているか確認してください。この変数はSitecoreエディターとの統合に必要です(これがなければ、Pages/Experience Editorで相対Next.jsアセットリクエストが失敗します)。
2.  マルチサイト構成で使用されているすべてのドメインが、 PUBLIC\_URL 変数に使われるドメインにアクセスできるようにしましょう。例えば、 Access-Control-Allow-Origin ヘッダーを使って。

> !注この問題はVercel上でデプロイされたアプリケーションには影響しません。なぜならVercelデプロイメントではVERCEL\_URL環境変数がパブリックURLとして使われているからです。 VERCEL\_URLはデプロイ時に生成され、すべてのオリジンがアクセス可能です。

## ホストドメイン名が欠落していることによるCORSの問題を解決してください

ドメイン名がCORSヘッダー設定に欠落している場合、CMホスト上でクロスオリジンリソースシェアリング(CORS)エラーが発生することがあります。この問題を軽減するために、sitecoreApiHostのヘッダーが欠落すると追加する新しいcors-header.jsプラグインを導入しました。

このプラグインはまた、SitecoreAIでリモートソースの異なるフォントを使おうとした際に発生する可能性のあるCORSの問題も修正できます。

## Vercelでアプリをホスティングする際の不正エラーを解決する

Vercel新しいプロジェクトではデフォルトで[デプロイメント](https://vercel.com/docs/security/deployment-protection)保護を有効にします。SitecoreAI環境がデプロイメント保護に対応していなければ、VERCEL\_URLを使って静的資産にアクセスする際にアプリで401 unauthorizedエラーが発生する可能性があります。

このエラーを解決するには、[アプリをデプロイメント保護で動作させる](https://doc.sitecore.com/xp/ja/developers/hd/21/sitecore-headless-development/use-the-vercel-deployment-protection-feature-with-jss-apps.html "Use the Vercel Deployment Protection feature with JSS apps") か、デプロイ [メント保護を無効](https://vercel.com/docs/security/deployment-protection/methods-to-protect-deployments/vercel-authentication#managing-vercel-authentication)にしてください。