翻訳は機械翻訳により提供されています。提供された翻訳内容と英語版の間で齟齬、不一致または矛盾がある場合、英語版が優先します。
# デプロイ Amazon Kendra
**注記**
機能のサポートは、使用されているインデックスタイプと検索 API によって異なります。使用しているインデックスタイプと検索 API でこの機能がサポートされているかどうかを確認するには、[インデックスのタイプ](https://docs.aws.amazon.com/kendra/latest/dg/hiw-index-types.html)に関するページを参照してください。
ウェブサイトに Amazon Kendra 検索をデプロイするときは、React で使用できるソースコードを提供して、アプリケーションの使用を開始できます。ソースコードは、改定版 MIT ライセンスの下で無償で提供されます。それをそのまま使うことも、自分のニーズに合わせて変更することもできます。提供されている React アプリは、作業の開始に役立つサンプルです。本番環境に対応したアプリではありません。
コードなしで検索アプリケーションをデプロイし、アクセス制御付きの検索ページにエンドポイント URL を生成する方法については、「[Amazon Kendra Experience Builder](https://docs.aws.amazon.com/kendra/latest/dg/deploying-search-experience-no-code.html)」を参照してください。
次のコード例では、既存の React ウェブアプリケーションに Amazon Kendra 検索を追加します。
+ [https://kendrasamples.s3.amazonaws.com/kendrasamples-react-app.zip](https://kendrasamples.s3.amazonaws.com/kendrasamples-react-app.zip) - デベロッパーが既存の React ウェブアプリケーションに機能検索エクスペリエンスを組み込むために使用できるサンプルファイル。
例は、 Amazon Kendra コンソールの検索ページに基づいてモデル化されています。これらには、検索結果を検索および表示するための同じ機能があります。例全体を使用することも、独自の使用のために機能を 1 つだけ選択することもできます。
Amazon Kendra コンソールで検索ページの 3 つのコンポーネントを表示するには、右側のメニューからコードアイコン (****) を選択します。各セクションにポインタを置くと、コンポーネントの簡単な説明が表示され、コンポーネントのソースの URL が表示されます。
**Topics**
+ [概要:](#example-overview)
+ [前提条件](#example-prereqs)
+ [例をセットアップする](#example-install)
+ [メイン検索ページ](#main-component)
+ [検索コンポーネント](#search-component)
+ [結果コンポーネント](#results-component)
+ [ファセットコンポーネント](#facets-component)
+ [ページ割りコンポーネント](#pagination-component)
+ [コードなしで検索エクスペリエンスを構築する](deploying-search-experience-no-code.md)
## 概要:
既存の React アプリケーションにサンプルコードを追加して、検索を有効にします。サンプルコードには、新しい React 開発環境を設定する手順が記載された Readme ファイルが含まれています。サンプルコード内のサンプルデータは、検索のデモンストレーションに使用できます。サンプル内の検索ファイルとコンポーネントは、次のように構成されています。
+ メイン検索ページ (`Search.tsx`) - これは、すべてのコンポーネントを含むメインページです。ここでは、アプリケーションを Amazon Kendra API と統合します。
+ 検索バー - これはユーザーが検索語を入力し、検索機能を呼び出すコンポーネントです。
+ 結果 — これは結果を表示するコンポーネントです Amazon Kendra。提案された回答、よくある質問の結果、推奨ドキュメントの 3 つのコンポーネントがあります。
+ ファセット - これは検索結果にファセットを表示するコンポーネントで、ファセットを選択して検索を狭めることができます。
+ ページ割り - これは Amazon Kendraからの応答をページ分割するコンポーネントです。
## 前提条件
開始するには、以下が必要です。
+ Node.js と npm が[インストール済み](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)。Node.js バージョン 19 以前が必要です。
+ Python 3 または Python 2 が[ダウンロードおよびインストール済み](https://www.python.org/downloads/)。
+ Amazon Kendraへの API コールを実行する [SDK for Java](https://docs.aws.amazon.com/sdk-for-java/latest/developer-guide/setup.html) または [AWS SDK for JavaScript](https://docs.aws.amazon.com/sdk-for-javascript/latest/developer-guide/welcome.html)。
+ 既存の React ウェブアプリケーション。サンプルコードには、必須フレームワーク/ライブラリの使用を含む、新しい React 開発環境を設定する手順が記載された Readme ファイルが含まれています。[React ウェブアプリの作成に関する React ドキュメント](https://create-react-app.dev/docs/getting-started)のクイックスタート手順に従うこともできます。
+ 開発環境で設定されている必要なライブラリと依存関係。サンプルコードには、必要なライブラリとパッケージの依存関係について記載された Readme ファイルが含まれています。`sass` は必須であり、`node-sass` は廃止済みであることに注意してください。以前に `node-sass` をインストールしていた場合は、これをアンインストールしてから `sass` をインストールしてください。
## 例をセットアップする
React アプリケーションに Amazon Kendra 検索を追加する完全な手順は、コード例に含まれている Readme ファイルにあります。
**kendrasamples-react-app.zip の使用開始方法**
1. Node.js と npm のダウンロードとインストールを含め、[前提条件](#example-prereqs) が完了していることを確認してください。
1. kendrasamples-react-app.zip をダウンロードして解凍します。
1. ターミナルを開いて、`aws-kendra-example-react-app/src/services/` に進みます。`local-dev-credentials.json` を開いて認証情報を提供します。このファイルをパブリックリポジトリに追加しないでください。
1. `aws-kendra-example-react-app` に進み、依存関係を `package.json` にインストールしてください。`npm install` を実行します。
1. ローカルサーバーでアプリのデモ版を起動します。`npm start` を実行します。キーボードで `Cmd/Ctrl + C` を入力すると、ローカルサーバーを停止できます。
1. ポートまたはホスト (IP アドレスなど) を変更するには、`package.json` に移動してホストとポートを `"start": "HOST=[host] PORT=[port] react-scripts start"` に更新します。Windows を使用している場合: `"start": "set HOST=[host] && set PORT=[port] && react-scripts start"`。
1. ウェブサイトのドメインを登録済みの場合は、アプリ名の後の `package.json` でこれを指定できます。例えば、`"homepage": "https://mywebsite.com"`。新しい依存関係を更新するためには `npm install` をもう一度実行してから、`npm start` を実行する必要があります。
1. アプリを構築するには、`npm build` を実行します。ビルドディレクトリの内容をホスティングプロバイダーにアップロードします。
**警告**
React アプリは本番環境に対応して**いません**。これは、 Amazon Kendra 検索用にアプリケーションをデプロイする例です。
## メイン検索ページ
メイン検索ページ (`Search.tsx`) には、すべてのサンプル検索コンポーネントが含まれています。これには、出力用の検索バーコンポーネント、[Query](https://docs.aws.amazon.com/kendra/latest/APIReference/API_Query.html) API からのレスポンスを表示する結果コンポーネント、およびレスポンスをページングするためのページ割りコンポーネントが含まれています。
## 検索コンポーネント
検索コンポーネントには、クエリテキストを入力するためのテキストボックスがあります。`onSearch` 機能は、メイン機能を `Search.tsx` で呼び出すフックで、 Amazon Kendra [Query](https://docs.aws.amazon.com/kendra/latest/APIReference/API_Query.html) API コールを行います。
## 結果コンポーネント
結果コンポーネントには、`Query` API からのレスポンスが表示されます。結果は 3 つの別個のエリアに表示されます。
+ 提案された回答 - これらは、`Query` API により返された上位結果です。提案された回答は最大 3 つまで含まれます。レスポンスには、結果タイプ `ANSWER` があります。
+ よくある質問の回答 - これらはレスポンスが返すよくある質問の結果です。よくある質問はインデックスに別々に追加されます。レスポンスには、タイプ `QUESTION_ANSWER` があります。詳細については、[質問と回答](https://docs.aws.amazon.com/kendra/latest/dg/in-creating-faq.html)を参照してください。
+ 推奨ドキュメント — これらは、レスポンスで が Amazon Kendra 返す追加のドキュメントです。`Query` API からのレスポンスには、`DOCUMENT` タイプがあります。
結果コンポーネントは、強調表示、タイトル、リンクなどの機能のコンポーネントを共有します。結果コンポーネントが機能するには、共有コンポーネントが存在する必要があります。
## ファセットコンポーネント
ファセットコンポーネントには、検索結果で使用可能なファセットが一覧表示されます。各ファセットは、製作者などの特定のディメンションに沿ってレスポンスを分類します。リストからファセットを選択して、検索を特定のファセットに絞り込むことができます。
ファセットを選択すると、コンポーネントによって、ファセットに一致するドキュメントの検索を制限する属性フィルターを使用して `Query` が呼び出されます。
## ページ割りコンポーネント
ページ割りコンポーネントを使用すると、複数のページでの `Query` API からの検索結果の表示が可能になります。`Query` API を `PageSize` および `PageNumber` パラメータで呼び出し、結果の特定のページを取得します。