Ez a megoldás egy aszinkron kliens-szerver streaming interfész, amely lehetővé teszi az adatfolyam alapú kommunikációt. A szerver oldalon egy FastAPI alkalmazásban definiáljuk a generate_response_stream
és a generate
függvényeket, míg a kliens oldal egy weboldalon futó JavaScript kódot tartalmaz, amely az API végponttal kommunikál.
generate_response_stream
aszinkron függvény: Ez a függvény végzi az OpenAI API-val való kommunikációt. A függvény egyquery
paramétert kap, amely alapján a modelltől választ kér. A választ chunk-okban (adattömbökben) kapja meg, amelyeket egyesével, azok beérkezése szerint küld tovább a kliens felé. Amennyiben a válasz állapota nem 200, egy HTTP kivételt dob.generate
aszinkron végpont: Egy API végpont, ami fogadja a kliens kéréseit. A kérés törzsében kapottquery
alapján hívja meg agenerate_response_stream
függvényt, és a választ egy streaming válaszként küldi vissza a kliensnek. AStreamingResponse
objektummedia_type
paramétere megadja a válasz tartalmának típusát, amely ebben az esetbenapplication/json
.
A kliens oldali kód egy HTML oldalon belül futó JavaScript, amely beküldi a felhasználói lekérdezéseket a szervernek és megjeleníti a válaszokat.
- Az űrlap beküldésekor (
onsubmit
eseménykezelő) a kód megakadályozza az alapértelmezett működést, azaz az oldal újratöltését. - A felhasználó által megadott lekérdezést (
query
) egy POST kérésben küldi el az API-nak, JSON formátumban. - A válasz a
.body.getReader()
metódussal kerül feldolgozásra, ami lehetővé teszi az adatok streamelését. - Az adatok dekódolása után a kód ellenőrzi, hogy az adatok JSON formátumúak-e, és feldolgozza őket.
- Az eredmény megjelenítése a felhasználó számára dinamikusan, a válaszok beérkezése szerint történik.
- Az adatfolyam végén rögzíti a keresés időtartamát, ami információt nyújt a felhasználónak a válaszidőről.
Ez a megközelítés lehetővé teszi az adatok aszinkron streamelését a kliens és a szerver között, javítva ezzel a felhasználói élményt nagy adatmennyiség vagy hosszabb feldolgozási idő esetén.
A Server-Sent Events (SSE) egy olyan webes technológia, amely lehetővé teszi a szerverek számára, hogy valós időben adatokat küldjenek a webböngészőknek egy HTTP kapcsolaton keresztül. Az SSE-t specifikusan az egyirányú kommunikációra tervezték, ahol a szerver aktívan küld adatokat a kliensnek, anélkül, hogy a kliensnek újabb kéréseket kellene indítania a szerver felé. Ez különbözteti meg a WebSockets-től, ami egy kétirányú kommunikációs protokoll.
- Egyszerűség: Az SSE használata egyszerűbb, mint a WebSockets, mert HTTP-t használ, így könnyebb integrálni meglévő HTTP alapú infrastruktúrákkal.
- Automatikus újrakapcsolódás: Ha a kapcsolat megszakad, a kliens automatikusan újrakapcsolódik a szerverhez.
- Egyirányú kommunikáció: Az SSE csak a szerverről a kliens felé történő adatfolyamot támogat, ami kisebb komplexitást jelent bizonyos alkalmazások számára.
- Szabványos HTTP kapcsolat: Mivel az SSE HTTP kapcsolaton működik, kompatibilis a legtöbb tűzfal és proxy szerverrel.
Az általad bemutatott kód nem használja közvetlenül az SSE protokollt, hanem egy általános aszinkron streaming megoldást implementál az OpenAI API-val való kommunikációra. Azonban az elv hasonló: a szerver folyamatosan küld adatokat a kliensnek az adatfolyam elérhetővé válása során. A különbség az, hogy az itt bemutatott megoldás egy specifikus API válaszait streameli a kliens felé, míg az SSE egy szabványosított módszer adatok kliensnek való pusholására webes alkalmazásokban.
Az SSE integrálása a bemutatott kódstruktúrába lehetővé tenné az adatok hatékonyabb streamelését a kliensnek, különösen eseményvezérelt alkalmazások esetén, ahol a szerver oldali események valós idejű közvetítése a kliens számára fontos. Például, ha az OpenAI API válaszai nagy mennyiségű adatot generálnak, vagy ha az adatok idővel változnak, az SSE segíthet az adatok hatékonyabb kliens oldali megjelenítésében anélkül, hogy a kliensnek periodikusan új lekérdezéseket kellene indítania.