V tomto tutoriálu ukážeme, jak používat OpenAI API ke zpracování uživatelských zpráv. V předchozím videu jsme použili pevný text ("hello"), ale nyní chceme zavést možnost přenášet text, který uživatel poskytl, pomocí URL . Je důležité, abyste porozuměli základům extrakce a předávání URL-parametrů API pro umožnění personalizované interakce s IA.
Nejdůležitější poznatky
- Učit se, jak předávat text uživatele jako dotazovací parametr v URL a jak komunikovat s OpenAI API.
- Zároveň zjistíte, jaké konfigurace jsou v projektu nutné pro podporu této funkcionality.
Krok za krokem
Abyste mohli implementaci provést, postupujte podle této krok za kroku instrukce.
Krok 1: Přípravy
Nejprve se ujistěte, že jste OpenAI API správně nastavili. V našem předchozím videu jsme ukázali, jak API volat a použít pevný řetězec. Měli byste již mít základní konfiguraci vašeho projektu dokončenou.
Krok 2: Předání uživatelského textu přes URL
Nyní chceme umožnit předání dynamického textu. Tento text bude předán naší aplikaci jako dotazovací parametr v URL. Parametry za otazníkem v URL jsou pro tuto metodu rozhodující.
V tomto kroku integrujeme logiku pro extrakci očekávaného parametru zprávy z URL. Parametr, který chceme použít, se jmenuje msg a je získáván pomocí url.searchParams.get("msg").
Krok 3: Zpracování zprávy
Po extrakci textu musíme tento text použít v API požadavku. Musíme se ujistit, že předaný text je skutečně odeslán do API.
Chcete-li během testování obdržet chybu jako "Bad Request", naznačuje to problém s předáním zprávy. Ověřte, zda je nový správně předaný parametr správně předán v žádosti.
Krok 4: Oprava chyb
Můžeme ještě mít nějaké potíže s konfigurací. Ujistěte se, že všechny požadované parametry jsou správně předány aplikaci. Pokud používáte pevný řetězec k ověření a funguje, můžete se ujistit, že chyba je výslovně v extrahovaném parametru.
Krok 5: Úprava Astro konfigurace
Důležitým prvkem je konfigurace vašeho projektu v Astro. Ujistěte se, že je nastaven výstupní hodnot Server. Tím je umožněno serverové vykreslení a korektní přečtení parametru z URL.
Tato změna je podstatná, protože vám umožní správně číst parametry a předávat je API.
Krok 6: Testování aplikace
Nyní můžete zkusit aplikaci testovat. Vyzkoušejte různé vstupy v URL, abyste viděli, jaké odpovědi od API obdržíte. Příkladem může být dotaz: ?msg=Hello World.
Odpověď se zobrazí v prohlížeči a měla by správně reagovat na vaši žádost. Pokud vše funguje správně, můžete zde již vidět první interakce s IA.
Krok 7: Rozšíření a závěr
V posledním kroku chceme rozšířit systém. Místo posílání pouze jednoho textu do API nyní můžete vést celý chatový historii. To umožní vést přirozenější konverzaci.
Pro další videa uvidíš, jak můžeš dále rozvíjet svou React aplikaci, abys vytvořil ještě uživatelsky přívětivější rozhraní.
Shrnutí
V tomto tutoriálu jsi se naučil, jak můžeš využít OpenAI API k předávání uživatelských zpráv pomocí URL parametrů. Nyní rozumíš důležitým krokům k přípravě, zpracování a testování tvého aplikace.
