1. Přehled přidání vyhledávání na web
V tomto kurzu azure AI Search vytvořte webovou aplikaci, která prohledává katalog knih, a pak web nasadíte do prostředku Azure Static Web Apps.
Tento kurz je určený pro vývojáře v JavaScriptu, kteří chtějí vytvořit front-endovou klientskou aplikaci, která zahrnuje interakce vyhledávání, jako je fasetová navigace, typová hlava a stránkování. Ukazuje také knihovnu @azure/search-documents
v sadě Azure SDK pro JavaScript pro volání služby Azure AI Search pro indexování a dotazování pracovních postupů v back-endu.
Co ukázka dělá?
Tento ukázkový web poskytuje přístup k katalogu 10 000 knih. Uživatel může katalog prohledávat zadáním textu na panelu hledání. Když uživatel zadá text, web k dokončení textu použije funkci návrhu vyhledávacího indexu. Po dokončení dotazu se zobrazí seznam knih s částí podrobností. Uživatel může vybrat knihu, aby se zobrazily všechny podrobnosti uložené v indexu vyhledávání knihy.
Vyhledávací prostředí zahrnuje:
- Vyhledávání – poskytuje funkci vyhledávání pro aplikaci.
- Navrhnout – poskytuje návrhy, když uživatel píše na panelu hledání.
- Fasety a filtry – poskytuje fasetovou navigační strukturu, která filtruje podle autora nebo jazyka.
- Stránkované výsledky – poskytuje ovládací prvky stránkování pro posouvání výsledků.
- Vyhledávání dokumentů – vyhledá dokument podle ID a načte veškerý jeho obsah stránky podrobností.
Jak je ukázka uspořádaná?
Vzorový kód obsahuje následující komponenty:
Aplikace | Účel | GitHubu Úložiště Poloha |
---|---|---|
Klient | Aplikace React (prezentační vrstva) k zobrazení knih s hledáním Volá aplikaci Funkcí Azure. | /search-website-functions-v4/client |
Server | Aplikace funkcí Azure (obchodní vrstva) – volá rozhraní API služby Azure AI Search pomocí sady JavaScript SDK. | /search-website-functions-v4/api |
Hromadné vložení (Bulk insert) | Soubor JavaScriptu pro vytvoření indexu a přidání dokumentů do něj. | /search-website-functions-v4/bulk-insert |
Nastavení vývojového prostředí
Do místního vývojového prostředí nainstalujte následující software.
-
- V tomto seznamu podporovaných jazykových verzí vyberte nejnovější modul runtime a verzi.
- Pokud máte na místním počítači nainstalovanou jinou verzi Node.js, zvažte použití Node Version Manageru (
nvm
) nebo kontejneru Dockeru.
Visual Studio Code a následující rozšíření
- Webová aplikace Azure Static
- Pro operace příkazového řádku použijte integrovaný terminál.
Nepovinné:
- Tento kurz nespouští rozhraní API služby Azure Functions místně. Pokud ho chcete spustit místně, musíte globálně nainstalovat nástroje azure-functions-core-tools pomocí následujícího příkazu Bash:
npm install -g azure-functions-core-tools@4
Vytvoření forku a naklonování ukázky hledání pomocí Gitu
Vytvoření forku ukázkového úložiště je důležité, aby bylo možné nasadit statickou webovou aplikaci. Statická webová aplikace určuje akce sestavení a obsah nasazení na základě vlastního umístění forku GitHubu. Provádění kódu ve statické webové aplikaci je vzdálené, přičemž statická webová aplikace čte z kódu ve vaší forkované ukázce.
Na GitHubu forkujte ukázkové úložiště.
Dokončete proces forku ve webovém prohlížeči pomocí účtu GitHub. Tento kurz používá váš fork jako součást nasazení do azure Static Web Appu.
V terminálu Bash si stáhněte rozvětvovanou ukázkovou aplikaci do místního počítače.
Nahraďte
YOUR-GITHUB-ALIAS
aliasem GitHubu.git clone https://github.com/YOUR-GITHUB-ALIAS/azure-search-javascript-samples
Ve stejném terminálu Bash přejděte do vašeho forku úložiště pro tento příklad vyhledávání na webu:
cd azure-search-javascript-samples
K otevření rozvětvovaného úložiště použijte příkaz
code .
editoru Visual Studio Code. Zbývající úlohy se provádějí v editoru Visual Studio Code, pokud nejsou zadané.code .
Vytvoření skupiny prostředků pro prostředky Azure
V editoru Visual Studio Code otevřete panel aktivit a vyberte ikonu Azure.
Pokud ještě nejste přihlášení, přihlaste se k Azure.
V části Zdroje vyberte Přidat (+) a pak vyberte Vytvořit skupinu prostředků.
Zadejte název skupiny prostředků, například
cognitive-search-demo-rg
.Zadejte oblast:
- Jako Node.js vyberte
West US 2
. Toto je doporučená oblast pro programovací model funkce Azure (PM) v4 Preview. - Pro C# a Python doporučujeme následující oblasti podporované službou Azure Static Web Apps od tohoto psaní:
West US 2
,East US 2
,West Europe
,Central US
East Asia
- Jako Node.js vyberte
Tuto skupinu prostředků použijte pro všechny prostředky vytvořené během tohoto kurzu. Skupina prostředků poskytuje logickou jednotku pro správu prostředků, včetně jejich odstranění po dokončení.