本文示範如何部署及執行Chat with your data sample for JavaScript。 此範例示範如何使用 JavaScript、Azure OpenAI 服務，以及 Azure AI 搜尋中的 檢索擴增生成 (RAG) 來實作聊天應用程式，以取得有關出租房產的答案。 租賃物件聊天應用程式已預先載入來自 Markdown 檔案（*.md）的資料，包括隱私權政策、服務條款和支援資訊。
- JavaScript 示範 - 全端影片
- JavaScript 示範 - 搭配 Python 後端的前端影片
遵循本文中的指示，您將會：
- 部署聊天應用程式至 Azure。
- 取得有關租賃物業網站資訊的解答。
- 變更設定以變更回應的行為。
完成本文之後，您可以使用自定義程式代碼和數據開始修改新專案。
本文是文章集合的一部分，說明如何使用 Azure OpenAI 服務和 Azure AI 搜尋來建置聊天應用程式。 集合中的其他文章包括：
注意事項
本文使用一個或多個 AI 應用程式範本 作為本文中範例與指引的基礎。 AI 應用程式範本提供您妥善維護且易於部署的參考實作，以協助確保 AI 應用程式的高品質起點。
架構概觀
下圖顯示聊天應用程式的簡單結構：
聊天範例應用程式是為名為 Contoso Real Estate 的虛構公司所建置，而智慧聊天體驗可讓其客戶詢問有關其產品使用方式的支援問題。 範例資料包括一組說明其服務條款、隱私權原則和支援指南的文件。 檔會在部署期間內嵌到架構中。
應用程式是由多個元件所組成，包括：
- 搜尋服務：提供搜尋和擷取功能的後端服務。
- 索引器服務：索引數據並建立搜尋索引的服務。
- Web 應用程式：提供使用者介面的前端 Web 應用程式，並協調使用者與後端服務之間的互動。
成本
此結構中的大部分資源都會使用基本或使用量價格層。 使用量價格是以使用量為基礎，這表示您只需支付您使用的費用。 為了完成本文，資源會產生費用，但費用很少。 當您完成本文時，您可以刪除資源來停止產生費用。
深入了解 範例存放庫中的成本。
必要條件
可供使用的 開發容器 環境已包含完成本文所需的所有相依項。 您可以在 GitHub Codespaces (瀏覽器中) 或使用 Visual Studio Code 在本機執行開發容器。
若要使用本文，您需要下列必要條件：
- Azure 訂用帳戶 - 免費建立一個
- Azure 帳戶權限 - 您的 Azure 帳戶必須具有 Microsoft.Authorization/roleAssignments/write 權限，例如 使用者存取系統管理員 或 擁有者。
- GitHub 帳戶
開啟開發環境
使用下列指示來部署預先設定的開發環境，其中包含完成本文所需的所有相依性。
GitHub Codespaces 會執行由 GitHub 管理的開發容器，並以 Visual Studio Code 網頁版 作為使用者介面。 如需最簡單直接的開發環境，請使用 GitHub Codespaces，讓您在完成本文時可直接使用預先安裝好的開發工具和相依性套件。
重要
所有 GitHub 帳戶每月都可以免費使用 Codespaces 長達 60 小時，並使用兩個核心實例。 如需更多資訊，請參閱 GitHub Codespaces 每月包含的儲存體和核心時數。
開始在
Azure-Samples/azure-search-openai-javascriptGitHub 存放庫的main分支上建立新的 GitHub Codespace 的程序。以滑鼠右鍵按一下下列按鈕，然後選取 在 新視窗中開啟連結 ，以同時開啟開發環境和文件。
在 [ 建立 codespace ] 頁面上，檢閱 codespace 組態設定，然後選取 [ 建立新的 codespace ]
等待 codespace 啟動。 此啟動程序可能需要幾分鐘的時間。
在畫面底部的終端機中，使用 Azure Developer CLI 登入 Azure。
azd auth login --use-device-code從終端機複製程式碼，然後將它貼到瀏覽器中。 遵循指示使用 Azure 帳戶進行驗證。
本文中的其餘任務都會在此開發容器環境中進行。
部署及執行
範例存放庫包含將聊天應用程式部署至 Azure 所需的所有程式碼和設定檔。 下列步驟會逐步引導您完成將範例部署至 Azure 的程序。
部署聊天應用程式至 Azure
重要
在本節中建立的 Azure 資源會產生立即成本，主要是來自 Azure AI 搜尋服務資源。 即使您在命令完全執行之前中斷命令，這些資源也可能會產生成本。
若要佈建 Azure 資源並部署原始程式碼，請執行下列 Azure 開發人員 CLI 命令：
azd up如果系統提示您輸入環境名稱，請將它保持簡短和小寫。 例如，
myenv。 它會作為資源群組名稱的一部分使用。出現提示時，選取要在其中建立資源的訂用帳戶。
第一次提示您選取位置時，請選取您附近的位置。 此位置用於大多數資源，包括託管。
如果系統提示您為 OpenAI 模型選擇區域，請選取離您較近的位置。 如果有與您的第一個位置相同的位置，請選取該位置。
等候應用程式部署。 部署可能需要 5-10 分鐘才能完成。
應用程式成功部署之後，您會看到終端機中顯示的 URL。
選取標示為
Deploying service web的 URL，以在瀏覽器中開啟聊天應用程式。
使用聊天應用程式從 Markdown 檔案取得答案
聊天應用程式預先載入了來自 Markdown 檔案目錄 的租賃資訊。 您可以使用聊天應用程式來詢問租用程式相關問題。 下列步驟會逐步引導您完成使用聊天應用程式的程序。
在瀏覽器中，選取或輸入 頁面底部文本框中的 [退款 原則為何]。
從答案中，選取 顯示思考過程。
在右側窗格中，使用分頁來了解答案是如何產生的。
索引標籤 描述 思考過程 此分頁是聊天中互動的腳本。 您可以查看系統提示（ content）和您的提問（content）。支援內容 此選項卡包括回答您的問題和源材料的信息。 開發人員設定中會指出來源資料引文的數目。 預設值是 3。 引文 此索引標籤會顯示包含引文的原始頁面。 完成後，請選取分頁標籤上方標有 X 的 hide 按鈕。
使用聊天應用程式設定來變更回應的行為
特定的 OpenAI 模型會決定聊天的智慧，以及用來與模型互動的設定。 [ 開發人員設定 ] 選項會開啟 [ 設定答案產生 ] 窗格，您可以在其中變更聊天應用程式的設定：
| 設定 | 描述 |
|---|---|
| 覆寫提示範本 | 此設定可控制用來產生答案的提示。 |
| 取得這麼多筆搜尋結果 | 此設定可控制用來產生答案的搜尋結果數目。 您可以在引用的 Thought process 和 Supporting content 分頁中看到這些來源。 |
| 排除類別 | 此設定可控制從搜尋結果中排除的文件類別。 |
| 使用語意排名工具進行擷取 | 此設定會啟用 Azure AI 搜尋服務 的功能，該功能會使用機器學習來改善搜尋結果的相關性。 |
| 使用查詢內容相關摘要，而不是整個文件 | 當同時勾選 Use semantic ranker 和 Use query-contextual summaries 時，LLM 會使用從排名最高的文件中關鍵段落擷取的摘要，而非使用所有段落。 |
| 建議後續問題 | 讓聊天應用程式根據答案建議後續問題。 |
| 檢索模式 | 向量 + 文字表示搜尋結果是以文件的文字和文件的內嵌項目為基礎。 向量表示搜尋結果是以文件的內嵌項目為基礎。 文字表示搜尋結果是以文件的文字為基礎。 |
| 串流傳送聊天補全回應 | 以串流方式回應，而不是等到完整答案產生後才回應。 |
下列步驟會逐步引導您完成變更設定的程序。
在瀏覽器中，選取 [ 開發人員設定 ] 索引標籤。
核取 [ 使用查詢內容摘要而非整個摘要 ] 核取方塊，然後再次提出相同的問題。
What happens if the rental doesn't fit the description?訊息回傳的回答更加簡潔。
清除資源
清除 Azure 資源
在本文中建立的 Azure 資源會向您的 Azure 訂用帳戶計費。 如果您預計未來不需要這些資源，請將其刪除，以避免產生更多費用。
刪除 Azure 資源，並使用下列 Azure 開發人員 CLI 命令移除原始程式碼：
azd down --purge
清理 GitHub Codespaces
刪除 GitHub Codespaces 環境，可確保您可將您為帳戶取得的每個核心免費時數權利數量最大化。
重要
如需 GitHub 帳戶權益的更多資訊，請參閱 GitHub Codespaces 每月包含的儲存空間與核心時數。
找出您目前正在執行且來源為
Azure-Samples/azure-search-openai-javascriptGitHub 儲存庫的 Codespaces。
開啟 codespace 的內容功能表，然後選取 刪除。
取得協助
此範例存放庫提供 疑難排解資訊。
如果您的問題仍未解決，請將問題提交到存放庫的 Issues。