本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。
部署 Amazon Kendra
注意
功能支援會因索引類型和正在使用的搜尋 API 而有所不同。若要查看您所使用的索引類型和搜尋 API 是否支援此功能，請參閱索引類型。
將 Amazon Kendra 搜尋部署到您的網站時，我們會提供原始程式碼，供您搭配 React 使用，以開始您的應用程式。原始程式碼根據修改後的 MIT 授權免費提供。您可以照原樣使用它，或根據自己的需求進行變更。提供的 React 應用程式是協助您開始使用的範例。它不是生產就緒應用程式。
若要部署沒有程式碼的搜尋應用程式，並使用存取控制產生端點 URL 到您的搜尋頁面，請參閱 Amazon Kendra Experience Builder。
下列範例程式碼會將 Amazon Kendra 搜尋新增至現有的 React Web 應用程式：
-
https://kendrasamples.s3.amazonaws.com/kendrasamples-react-app.zip
—範例檔案，開發人員可用來在現有的 React Web 應用程式中建置功能搜尋體驗。
這些範例會在 Amazon Kendra 主控台的搜尋頁面之後建立模型。它們具有搜尋和顯示搜尋結果的相同功能。您可以使用整個範例，也可以只選擇其中一個功能供您使用。
若要在 Amazon Kendra 主控台中查看搜尋頁面的三個元件，請從右側選單中選擇程式碼圖示 (</>)。將游標暫留在每個區段上，以查看元件的簡短描述，並取得元件來源的 URL。
概觀
您可以將範例程式碼新增至現有的 React Web 應用程式，以啟用搜尋。範例程式碼包含讀我檔案，其中包含設定新 React 開發環境的步驟。程式碼範例中的範例資料可用來示範搜尋。範例程式碼中的搜尋檔案和元件結構如下：
-
主搜尋頁面 (
Search.tsx) — 這是包含所有元件的主頁面。這是您將應用程式與 Amazon Kendra API 整合的位置。 -
搜尋列 - 這是使用者輸入搜尋詞彙並呼叫搜尋函數的元件。
-
結果 - 這是顯示結果的元件 Amazon Kendra。它有三個元件：建議的答案、常見問答集結果和建議的文件。
-
面向：這是顯示搜尋結果中面向的元件，可讓您選擇面向來縮小搜尋範圍。
-
分頁：這是從 分頁回應的元件 Amazon Kendra。
先決條件
開始之前，您必須準備好以下事項：
-
已安裝
Node.js 和 npm。需要 Node.js 19 版或更新版本。 -
Python 3 或 Python 2 已下載並安裝
。 -
SDK for Java 或 AWS SDK for JavaScript 進行 API 呼叫 Amazon Kendra。
-
現有的 React Web 應用程式。範例程式碼包含讀我檔案，其中包含如何設定新 React 開發環境的步驟，包括使用必要的架構/程式庫。您也可以遵循建立 React Web 應用程式的 React 文件
中的快速入門說明。 -
在您的開發環境中設定的必要程式庫和相依性。範例程式碼包含讀我檔案，列出所需的程式庫和套件相依性。請注意，
sass是必要的，node-sass已棄用。如果您先前已安裝node-sass，請解除安裝此 並安裝sass。
設定範例
將 Amazon Kendra 搜尋新增至 React 應用程式的完整程序位於程式碼範例中的讀我檔案。
開始使用 kendrasamples-react-app.zip
-
請確定您已完成 先決條件，包括下載並安裝 Node.js 和 npm。
-
下載 kendrasamples-react-app.zip 並解壓縮。
-
開啟您的終端機並前往
aws-kendra-example-react-app/src/services/。開啟local-dev-credentials.json並提供您的登入資料。請勿將此檔案新增至任何公有儲存庫。 -
前往
aws-kendra-example-react-app並在 中安裝相依性package.json。執行npm install。 -
在本機伺服器上啟動應用程式的示範版本。執行
npm start。您可以在鍵盤上輸入 來停止本機伺服器Cmd/Ctrl + C。 -
您可以前往
package.json並更新主機和連接埠，以變更連接埠或主機 （例如 IP 地址）："start": "HOST=[host] PORT=[port] react-scripts start"。如果您使用 Windows："start": "set HOST=[host] && set PORT=[port] && react-scripts start"。 -
如果您有已註冊的網站網域，您可以在應用程式名稱
package.json後面的 中指定此網域。例如："homepage": "https://mywebsite.com"。您必須npm install再次執行 以更新新的相依性，然後執行npm start。 -
若要建置應用程式，請執行
npm build。將建置目錄的內容上傳至您的託管提供者。警告
React 應用程式尚未準備好生產。這是部署應用程式進行 Amazon Kendra 搜尋的範例。
主要搜尋頁面
主要搜尋頁面 (Search.tsx) 包含所有搜尋元件範例。它包含用於輸出的搜尋列元件、用於顯示查詢 API 回應的結果元件，以及用於分頁通過回應的分頁元件。
搜尋元件
搜尋元件提供文字方塊以輸入查詢文字。onSearch 函數是一種勾點，可呼叫 中的主要函數Search.tsx，以發出查詢 API Amazon Kendra 呼叫。
結果元件
結果元件會顯示來自 Query API 的回應。結果會顯示在三個不同的區域中。
-
建議的答案 - 這些是
QueryAPI 傳回的熱門結果。它最多包含三個建議的答案。在回應中，它們具有結果類型ANSWER。 -
常見問答集答案 - 這些是回應傳回的常見問答集結果。FAQs會個別新增至索引。在回應中，它們具有 類型
QUESTION_ANSWER。如需詳細資訊，請參閱問題和答案。 -
建議文件 - 這些是在回應中 Amazon Kendra 傳回的其他文件。在
QueryAPI 的回應中，它們的類型為DOCUMENT。
結果元件會共用一組元件，用於反白、標題、連結等功能。共用元件必須存在，結果元件才能運作。
面向元件
面向元件會列出搜尋結果中可用的面向。每個面向都會沿著特定維度分類回應，例如作者。您可以從清單中選擇一個面向，將搜尋精簡到特定面向。
選取面向後，元件Query會使用屬性篩選條件呼叫 ，將搜尋限制為符合面向的文件。
分頁元件
分頁元件可讓您在多個頁面中顯示 Query API 的搜尋結果。它使用 PageSize和 PageNumber 參數呼叫 Query API，以取得特定的結果頁面。
