JSS Vue.jsサンプルアプリでのGraphQLサポート
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
サンプルアプリケーションは、コンテンツや他のカスタムデータスキーマへのアクセス(例えば、既存のバックエンドRESTサービスの集約)を可能にするために、Sitecore GraphQLの使用をサポートしています。
Sitecore GraphQLは切断されたモックサービスを搭載していないため、接続、統合、またはヘッドレス のアプリケーションモードで動作するJSSアプリでのみ動作可能です。切断されたGraphQL機能が必要な場合は、GraphQL-Toolsが非常に強力なGraphQLモッキング機能を備えています。
このトピックの残りの部分では、接続モードでGraphQLを使用する方法について説明します。
!重要接続型アプリケーションモードと 接続型GraphQLを混同しないでください。
Vueのサンプルアプリは @vue/apolloライブラリを使用し、さらにApollo GraphQLクライアントと連携しています。使用方法や実装の詳細は @vue/apolloドキュメントに従ってください。
サーバー側レンダリング(SSR)では、サンプルアプリは@vue/apolloのprefetch機能を使ってクエリデータをプリフェッチし、サーバー上でHTML GraphQLアプリをレンダリングします。これにより、GraphQLクエリの非同期結果を評価したSSRが可能になります。GraphQLを使わない場合は、@vue/apolloプリフェッチ機能を解除できます。
接続型および統合型GraphQLの完全な例はフォルダsrc/componentsに掲載されており、ドキュメントコメントも含まれています。例えば、src/components/GraphQL-ConnectedDemoは接続GraphQLの使い方を示しています。実装の詳細についてはこれらのサンプルを参照してください。