1. Zanim zaczniesz
Z tego przewodnika dowiesz się, jak używać Genkit do integrowania generatywnej AI z aplikacją. Genkit to platforma open source, która pomaga tworzyć, wdrażać i monitorować aplikacje oparte na AI gotowe do wdrożenia w środowisku produkcyjnym.
Genkit został zaprojektowany z myślą o deweloperach aplikacji, aby ułatwić im integrowanie zaawansowanych funkcji AI w aplikacjach przy użyciu znanych wzorców i paradygmatów. Został on stworzony przez zespół Firebase, który wykorzystał swoje doświadczenie w tworzeniu narzędzi używanych przez miliony programistów na całym świecie.
Wymagania wstępne
- znajomość Firestore, Node.js i TypeScriptu;
Czego się nauczysz
- Jak tworzyć inteligentniejsze aplikacje dzięki zaawansowanym funkcjom wyszukiwania podobieństwa wektorowego w Firestore.
- Jak praktycznie wdrożyć generatywną AI w aplikacjach za pomocą Genkit.
- Przygotuj rozwiązanie do wdrożenia i integracji.
Czego potrzebujesz
- wybraną przeglądarkę, np. Google Chrome;
- Środowisko programistyczne z edytorem kodu i terminalem
- konto Google do tworzenia projektu Firebase i zarządzania nim;
2. Sprawdź używane aplikacje internetowe i usługi w chmurze
W tej sekcji zapoznasz się z aplikacją internetową, którą utworzysz w ramach tego laboratorium, oraz z usługami w chmurze, z których będziesz korzystać.
Aplikacja internetowa
W tym module będziesz pracować w kodzie aplikacji Compass, która służy do planowania wakacji. Użytkownicy mogą wybrać miejsce docelowe, przejrzeć dostępne tam atrakcje i utworzyć plan podróży.
W tym ćwiczeniu z programowania wdrożysz 2 nowe funkcje, które mają zwiększyć zaangażowanie użytkowników na stronie głównej aplikacji. Obie funkcje są oparte na generatywnej AI:
- Aplikacja wyświetla obecnie statyczną listę miejsc docelowych. Zmienisz go na dynamiczny.
- Zaimplementujesz automatycznie wypełniany plan podróży, aby zwiększyć zaangażowanie użytkowników.
Używane usługi
W tym laboratorium kodowania użyjesz wielu usług i funkcji Firebase i Cloud, a większość kodu początkowego jest już dostępna. W tabeli poniżej znajdziesz usługi, z których będziesz korzystać, oraz powody ich używania.
Usługa | Powód użycia |
Genkit umożliwia wprowadzenie generatywnej AI do aplikacji Node.js lub Next.js. | |
Dane są przechowywane w Cloud Firestore, a następnie używane do wyszukiwania podobieństwa wektorowego. | |
Do obsługi funkcji AI używasz modeli podstawowych z Vertex AI (takich jak Gemini). | |
Opcjonalnie możesz użyć nowego, uproszczonego hostingu aplikacji Firebase do obsługi dynamicznej aplikacji internetowej Next.js (połączonej z repozytorium GitHub). |
3. Konfigurowanie środowiska programistycznego
Sprawdzanie wersji Node.js
- W terminalu sprawdź, czy masz zainstalowaną wersję Node.js 20.0.0 lub nowszą:
node -v
- Jeśli nie masz Node.js w wersji 20.0.0 lub nowszej, pobierz najnowszą wersję LTS i zainstaluj ją.
Pobieranie kodu źródłowego ćwiczeń z programowania
Jeśli masz konto GitHub:
- Utwórz nowe repozytorium za pomocą naszego szablonu z github.com/FirebaseExtended/codelab-ai-genkit-rag
- Utwórz lokalną kopię utworzonego przed chwilą repozytorium GitHub z ćwiczeniami:
git clone https://github.com/<your-github-handle>/codelab-ai-genkit-rag
Jeśli nie masz zainstalowanego narzędzia git lub nie chcesz tworzyć nowego repozytorium:
Pobierz repozytorium GitHub jako plik ZIP.
Sprawdź strukturę folderów
Na komputerze lokalnym znajdź sklonowane repozytorium i sprawdź strukturę folderów:
Folder | Opis |
| Narzędzie wiersza poleceń, które umożliwia szybkie wstępne wypełnianie kolekcji Firestore |
*wszystkie inne | Kod aplikacji internetowej Next.js |
Folder główny zawiera plik README.md
, który dzięki uproszczonym instrukcjom umożliwia szybkie uruchomienie aplikacji internetowej. Jeśli jednak dopiero zaczynasz naukę, wykonaj to laboratorium (zamiast szybkiego startu), ponieważ zawiera ono najbardziej wyczerpujący zestaw instrukcji.
Jeśli nie masz pewności, czy kod został zastosowany prawidłowo zgodnie z instrukcjami w tym laboratorium, kod rozwiązania znajdziesz w end
gałęzi git.
Instalowanie wiersza poleceń Firebase
- Sprawdź, czy masz zainstalowany wiersz poleceń Firebase w wersji 13.6 lub nowszej:
firebase --version
- Jeśli masz zainstalowany wiersz poleceń Firebase, ale nie jest to wersja 13.6 lub nowsza, zaktualizuj go:
npm update -g firebase-tools
- Jeśli nie masz zainstalowanego wiersza poleceń Firebase, zainstaluj go:
npm install -g firebase-tools
Jeśli nie możesz zaktualizować ani zainstalować wiersza poleceń Firebase z powodu błędów uprawnień, zapoznaj się z dokumentacją npm lub skorzystaj z innej opcji instalacji.
Logowanie w Firebase
- W terminalu zaloguj się w Firebase:
Jeśli w terminalu pojawi się informacja, że jesteś już zalogowany(-a) w Firebase, możesz przejść do sekcji Konfigurowanie projektu Firebase w tym samouczku.firebase login
- W terminalu wpisz
Y
lubN
w zależności od tego, czy chcesz, aby Firebase zbierał dane. (obie opcje działają w tym ćwiczeniu) - W przeglądarce wybierz konto Google i kliknij Zezwól.
Instalowanie interfejsu wiersza poleceń gcloud Google Cloud
- Zainstaluj gcloud CLI.
- W terminalu zaloguj się w Google Cloud:
gcloud auth login
4. Konfigurowanie projektu Firebase
W tej sekcji skonfigurujesz projekt Firebase i zarejestrujesz w nim aplikację internetową Firebase. W dalszej części tego laboratorium włączysz też kilka usług, z których korzysta przykładowa aplikacja internetowa.
Wszystkie czynności opisane w tej sekcji wykonuje się w konsoli Firebase.
Tworzenie projektu Firebase
- Zaloguj się w konsoli Firebase za pomocą tego samego konta Google, którego używasz w poprzednim kroku.
- Kliknij przycisk, aby utworzyć nowy projekt, a potem wpisz jego nazwę (np.
Compass Codelab
).
- Kliknij Dalej.
- Po wyświetleniu monitu przeczytaj i zaakceptuj warunki usługi Firebase, a potem kliknij Dalej.
- (Opcjonalnie) Włącz w konsoli Firebase pomoc AI (nazywaną „Gemini w Firebase”).
- W tym samouczku nie potrzebujesz Google Analytics, więc wyłącz opcję Google Analytics.
- Kliknij Utwórz projekt, poczekaj, aż projekt zostanie udostępniony, a następnie kliknij Dalej.
Dodawanie aplikacji internetowej do projektu Firebase
- Otwórz ekran Omówienie projektu w projekcie Firebase, a potem kliknij
Internet.
- W polu tekstowym Pseudonim aplikacji wpisz łatwy do zapamiętania pseudonim aplikacji, np.
My Compass Codelab App
. Możesz pozostawić pole wyboru konfiguracji Hostingu Firebase niezaznaczone, ponieważ w ostatnim kroku tego laboratorium możesz opcjonalnie skonfigurować usługę hostingową. - Kliknij Zarejestruj aplikację > Przejdź do konsoli.
Świetnie! Aplikacja internetowa została zarejestrowana w nowym projekcie Firebase.
Przejście na wyższy abonament Firebase
Aby korzystać z Genkit i Vertex AI (oraz ich usług w chmurze), Twój projekt Firebase musi być objęty abonamentem z płatnością za wykorzystanie (Blaze), co oznacza, że musi być połączony z kontem rozliczeniowym Cloud.
- Konto rozliczeniowe Cloud wymaga formy płatności, np. karty kredytowej.
- Jeśli dopiero zaczynasz korzystać z Firebase i Google Cloud, sprawdź, czy możesz otrzymać środki w wysokości 300 USD i bezpłatne konto rozliczeniowe Cloud.
- Jeśli wykonujesz te ćwiczenia w ramach wydarzenia, zapytaj organizatora, czy są dostępne środki w Google Cloud.
Dowiedz się więcej o cenniku Vertex AI.
Aby przenieść projekt na abonament Blaze:
- W konsoli Firebase wybierz przejście na wyższy abonament.
- Wybierz pakiet Blaze. Postępuj zgodnie z instrukcjami wyświetlanymi na ekranie, aby połączyć konto rozliczeniowe Cloud z projektem.
Jeśli w ramach tego przejścia na wyższy abonament konieczne było utworzenie konta rozliczeniowego Cloud, może być konieczne powrócenie do procesu przejścia na wyższy abonament w konsoli Firebase, aby go dokończyć.
Konfigurowanie Cloud Firestore
- W panelu po lewej stronie konsoli Firebase rozwiń Kompilacja, a następnie wybierz Baza danych Firestore.
- Kliknij Utwórz bazę danych.
- W polu Identyfikator bazy danych pozostaw wartość
(default)
. - Wybierz lokalizację bazy danych i kliknij Dalej.
W przypadku prawdziwej aplikacji wybierz lokalizację, która jest blisko użytkowników. - Kliknij Uruchom w trybie testowym. Przeczytaj wyłączenie odpowiedzialności dotyczące reguł zabezpieczeń.
Nie rozpowszechniaj ani nie udostępniaj publicznie aplikacji bez dodania reguł zabezpieczeń do bazy danych. - Kliknij Utwórz.
Włączanie Vertex AI
Aby skonfigurować Vertex AI, użyj interfejsu wiersza poleceń gcloud
. We wszystkich poleceniach na tej stronie zastąp YOUR_PROJECT_ID
identyfikatorem projektu Firebase.
- W terminalu ustaw projekt domyślny dla pakietu Google Cloud SDK:
gcloud config set project YOUR_PROJECT_ID
- Jeśli zobaczysz komunikat ostrzegawczy „WARNING: Your active project does not match the quota project in your local Application Default Credentials file. Może to spowodować nieoczekiwane problemy z limitami”. Następnie uruchom to polecenie, aby ustawić projekt limitu:
gcloud auth application-default set-quota-project YOUR_PROJECT_ID
- Włącz usługę Vertex AI w projekcie:
gcloud services enable aiplatform.googleapis.com
5. Konfigurowanie aplikacji internetowej
Aby uruchomić aplikację internetową, musisz uruchomić polecenia w terminalu i dodać kod w edytorze kodu. We wszystkich poleceniach na tej stronie zastąp YOUR_PROJECT_ID
identyfikatorem projektu Firebase.
Skonfiguruj wiersz poleceń Firebase tak, aby kierował polecenia do Twojego projektu
- W terminalu przejdź do katalogu głównego projektu codelab.
- Aby wiersz poleceń Firebase wykonywał wszystkie polecenia w Twoim projekcie Firebase, uruchom to polecenie:
firebase use YOUR_PROJECT_ID
Importowanie przykładowych danych do Firestore
Aby ułatwić Ci rozpoczęcie pracy, w tym ćwiczeniu znajdziesz wstępnie wygenerowane przykładowe dane Firestore.
- Aby umożliwić lokalnej bazie kodu uruchamianie kodu, który zwykle korzysta z konta usługi, uruchom w terminalu to polecenie:
Otworzy się nowa karta przeglądarki. Zaloguj się na to samo konto Google, którego używasz w poprzednich krokach.gcloud auth application-default login
- Aby zaimportować przykładowe dane Firestore, uruchom te polecenia:
cd load-firestore-data npm ci node index.js YOUR_PROJECT_ID cd ..
- Sprawdź, czy dane zostały dodane do bazy danych. W tym celu otwórz sekcję Firestore w projekcie Firebase w konsoli Firebase. Powinny się tam wyświetlać zaimportowany schemat danych i jego zawartość.
Łączenie aplikacji internetowej z projektem Firebase
Aby korzystać z usług Firebase, takich jak baza danych, kod aplikacji internetowej musi być powiązany z odpowiednim projektem Firebase. Aby to zrobić, musisz dodać konfigurację Firebase do kodu aplikacji. Ta konfiguracja zawiera podstawowe wartości, takie jak identyfikator projektu, klucz interfejsu API i identyfikator aplikacji, a także inne wartości, które umożliwiają aplikacji interakcję z Firebase.
- Uzyskaj konfigurację Firebase aplikacji:
- W konsoli Firebase otwórz projekt Firebase.
- W panelu po lewej stronie kliknij ikonę koła zębatego obok opcji Przegląd projektu i wybierz Ustawienia projektu.
- Na karcie „Twoje aplikacje” wybierz aplikację internetową.
- W sekcji „Konfiguracja pakietu SDK” kliknij opcję Konfiguracja.
- Skopiuj fragment kodu. Zaczyna się od
const firebaseConfig ...
.
- Dodaj konfigurację Firebase do kodu aplikacji internetowej:
- W edytorze kodu otwórz plik
src/lib/genkit/genkit.config.ts
. - Zastąp odpowiednią sekcję skopiowanym kodem.
- Zapisz plik.
- W edytorze kodu otwórz plik
Wyświetlanie podglądu aplikacji internetowej w przeglądarce
- W terminalu zainstaluj zależności, a następnie uruchom aplikację internetową:
npm install npm run dev:next
- W przeglądarce otwórz adres URL hostingu lokalnego, aby wyświetlić aplikację internetową. W większości przypadków adres URL to http://localhost:3000/ lub podobny.
Compass to aplikacja Next.js korzystająca z komponentów serwera React. To jest strona główna.
Kliknij Znajdź wycieczkę marzeń. Możesz zobaczyć, że wyświetla ona zakodowane na stałe dane dotyczące niektórych stałych miejsc docelowych:
Zapoznaj się z nimi. Gdy zechcesz kontynuować, kliknij przycisk strony głównej (w prawym górnym rogu).
6. Poznaj generatywną AI dzięki Genkit
Możesz teraz wykorzystać w swojej aplikacji możliwości generatywnej AI. W tej sekcji ćwiczeń z programowania dowiesz się, jak wdrożyć funkcję, która sugeruje miejsca docelowe na podstawie inspiracji podanych przez użytkownika. Będziesz używać Genkit i Vertex AI od Google Cloud jako dostawcy modelu generatywnego (będziesz korzystać z Gemini).
Genkit może przechowywać ślady i stan przepływu (co umożliwia sprawdzanie wyników wykonywania przepływów Genkit). W tym laboratorium będziesz używać Firestore do przechowywania tych śladów.
Na ostatnim etapie tego kursu wdrożysz aplikację Genkit w usłudze Firebase App Hosting.
Łączenie aplikacji Genkit z projektem Firebase
W poprzednim kroku połączyliśmy już Genkit z Twoim projektem, edytując plik src/lib/genkit/genkit.config.ts
.
Uruchamianie interfejsu dewelopera Genkit
Genkit ma interfejs internetowy, który umożliwia interakcję z LLM, przepływami Genkit, modułami pobierania i innymi komponentami AI.
W terminalu uruchom:
npm run dev:genkit
W przeglądarce otwórz adres URL Genkit hostowany lokalnie. W większości przypadków jest to http://localhost:4000/.
Interakcja z Gemini
W interfejsie programisty Genkit możesz teraz korzystać z dowolnego z obsługiwanych modeli lub innych komponentów AI, takich jak prompty, wyszukiwarki i przepływy Genkit.
Możesz na przykład poprosić Gemini o zaproponowanie pomysłu na wakacje. Zwróć uwagę, jak możesz używać instrukcji systemowych, aby kierować zachowaniem modelu w zależności od swoich potrzeb. Działa to również w przypadku modeli, które nie obsługują natywnie instrukcji systemowych.
Zarządzanie promptami
Genkit wprowadza Dotprompt, wtyczkę i format tekstu zaprojektowane w celu usprawnienia tworzenia promptów generatywnej AI i zarządzania nimi. Główna idea Dotprompt polega na traktowaniu promptów jako kodu, co umożliwia pisanie, aktualizowanie i kontrolowanie ich wersji wraz z kodem aplikacji.
Aby użyć Dotprompt, zacznij od programu „hello-world”:
- W edytorze kodu otwórz plik
prompts/1-hello-world.prompt
. - W interfejsie programisty Genkit otwórz
prompts/1-hello-world
. - Użyj dowolnej nazwy lub kodu języka, który znasz, lub pozostaw puste pole.
- Kliknij Uruchom.
- Wypróbuj kilka różnych wartości. Duże modele językowe dobrze radzą sobie z rozumieniem skróconych, błędnie napisanych lub niekompletnych promptów w prostych zapytaniach, takich jak to.
Wzbogacanie danych wyjściowych za pomocą danych strukturalnych
Genkit nie tylko generuje zwykły tekst, ale też umożliwia strukturyzowanie danych wyjściowych w celu lepszej prezentacji i integracji w interfejsie aplikacji. Definiując schemat, możesz poinstruować LLM, aby generował dane strukturalne zgodne z wybranym formatem.
Badanie schematów wyjściowych
Możesz też określić schemat danych wyjściowych wywołania LLM.
- W edytorze kodu sprawdź plik prompta:
- Otwórz plik
prompts/2-simple-itinerary.prompt
. - Sprawdź zdefiniowane schematy danych wejściowych i wyjściowych.
- Otwórz plik
- Interakcja z interfejsem:
- W interfejsie deweloperskim Genkit otwórz sekcję
prompts/2-simple-itinerary
. - Wpisz dane wejściowe, wypełniając pola
place
iinterests
przykładowymi danymi:{ "interests": [ "Museums" ], "place": "Paris" }
- Kliknij Wykonaj.
- W interfejsie deweloperskim Genkit otwórz sekcję
Informacje o danych wyjściowych opartych na schemacie
Zwróć uwagę, jak wygenerowane dane wyjściowe są zgodne ze zdefiniowanym schematem. Określając żądaną strukturę, instruujesz LLM, aby generował dane, które można łatwo przeanalizować i zintegrować z aplikacją. Genkit automatycznie weryfikuje dane wyjściowe pod kątem schematu, zapewniając integralność danych.
Możesz też skonfigurować Genkit tak, aby ponawiał próby lub próbował naprawić dane wyjściowe, jeśli nie pasują do schematu.
Najważniejsze zalety schematów wyjściowych
- Uproszczona integracja: łatwo włączaj dane strukturalne do elementów interfejsu aplikacji.
- Sprawdzanie poprawności danych: zapewnij dokładność i spójność wygenerowanych wyników.
- Obsługa błędów: wdróż mechanizmy, które pozwolą rozwiązywać problemy z niezgodnością schematów.
Korzystanie ze schematów wyjściowych zwiększa możliwości Genkit, umożliwiając tworzenie dostosowanych danych strukturalnych, które zapewniają bogatsze i bardziej dynamiczne wrażenia użytkownika.
Korzystanie z wielomodalnego wprowadzania danych
Wyobraź sobie, że Twoja aplikacja sugeruje spersonalizowane miejsca docelowe na wakacje na podstawie zdjęć, które inspirują użytkowników. Genkit w połączeniu z multimodalnym modelem generatywnym umożliwia realizację tej wizji.
- W edytorze kodu sprawdź plik prompta:
- Otwórz plik
prompts/imgDescription.prompt
. - Zwróć uwagę na znak
{{media url=this}}
, który jest elementem składni Handlebars ułatwiającym wstawianie obrazów do prompta.
- Otwórz plik
- Interakcja z interfejsem:
- W interfejsie deweloperskim Genkit otwórz prompt
prompts/imgDescription
. - Wklej adres URL obrazu w polu
imageUrls
. Możesz na przykład użyć miniatury z Wikipedii przedstawiającej wieżę Eiffla:{ "imageUrls": [ "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4b/La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg/556px-La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg" ] }
- Kliknij Wykonaj.
- W interfejsie deweloperskim Genkit otwórz prompt
7. Wdrażanie pobierania za pomocą wyszukiwania podobieństwa wektorowego
Generowanie kreatywnych treści za pomocą modeli AI jest imponujące, ale praktyczne zastosowania często wymagają osadzenia danych wyjściowych w określonym kontekście.
W tym przypadku masz bazę danych miejsc docelowych (miejsc i atrakcji) i chcesz mieć pewność, że wygenerowane przez model Gemini sugestie będą odnosić się wyłącznie do wpisów w tej bazie danych.
Aby wypełnić lukę między nieustrukturyzowanymi zapytaniami a odpowiednimi treściami, wykorzystasz wyszukiwanie podobieństwa wektorowego na wygenerowanych wektorach dystrybucyjnych.
Wektory dystrybucyjne i podobieństwo wektorów
- Wektory: wektory to numeryczne reprezentacje punktów danych, często używane do modelowania złożonych informacji, takich jak tekst lub obrazy. Każdy wymiar w wektorze odpowiada konkretnej funkcji danych.
- Modele wektorów dystrybucyjnych: te specjalistyczne modele AI przekształcają dane wejściowe, takie jak tekst, w wektory o dużej liczbie wymiarów. Fascynujące jest to, że podobne dane wejściowe są mapowane na wektory, które są blisko siebie w tej przestrzeni wielowymiarowej.
- Wyszukiwanie podobieństwa wektorowego: ta technika wykorzystuje bliskość wektorów dystrybucyjnych do identyfikowania odpowiednich punktów danych. Na podstawie zapytania wejściowego znajduje w bazie danych wpisy o podobnych wektorach dystrybucyjnych, co wskazuje na powiązanie semantyczne.
Jak działa proces odzyskiwania
- Osadzanie zapytania: dane wejściowe użytkownika (np. „romantyczna kolacja w Paryżu”) są przekazywane przez model osadzania, który generuje wektor zapytania.
- Osadzanie bazy danych: najlepiej, jeśli baza danych miejsc docelowych została wstępnie przetworzona i dla każdego wpisu utworzono wektory osadzania.
- Obliczanie podobieństwa: wektor zapytania jest porównywany z każdym wektorem dystrybucyjnym w bazie danych za pomocą miary podobieństwa (np. podobieństwa kosinusowego).
- Wyszukiwanie: najbardziej podobne wpisy z bazy danych, na podstawie ich bliskości do wektora zapytania, są pobierane jako trafne sugestie.
Dzięki włączeniu tego mechanizmu wyszukiwania do aplikacji możesz wykorzystać model Gemini do generowania sugestii, które są nie tylko kreatywne, ale też ściśle powiązane z Twoim konkretnym zbiorem danych. Dzięki temu wygenerowane dane wyjściowe pozostaną odpowiednie kontekstowo i zgodne z informacjami dostępnymi w Twojej bazie danych.
Włączanie wyszukiwania podobieństwa wektorów w Firestore
W poprzednim kroku tego laboratorium utworzyliśmy w bazie danych Firestore przykładowe miejsca i aktywności. Każdy wpis dotyczący miejsca zawiera knownFor
pole tekstowe z opisem jego istotnych atrybutów oraz odpowiadające mu embedding
pole zawierające wektorową reprezentację tego opisu.
Aby wykorzystać możliwości wyszukiwania podobieństwa wektorowego w przypadku tych wektorów dystrybucyjnych, musisz utworzyć indeks Firestore. Ten indeks umożliwia wydajne pobieranie miejsc na podstawie podobieństwa wektorów osadzania do danego zapytania.
- Utwórz indeks, pamiętając o zastąpieniu
YOUR_PROJECT_ID
identyfikatorem projektu.gcloud firestore indexes composite create --project=YOUR_PROJECT_ID --collection-group=places --query-scope=COLLECTION --field-config field-path=embedding,vector-config='{"dimension":"768","flat": "{}"}'
- W interfejsie programisty Genkit otwórz
retrievers/placesRetriever
. - Kliknij Wykonaj. Obserwuj obiekt z tekstem zastępczym, który wskazuje, gdzie zaimplementujesz logikę pobierania.
- W edytorze kodu otwórz plik
src/lib/genkit/placesRetriever.ts
. - Przewiń na sam dół i zastąp obiekt zastępczy
placesRetriever
tym tekstem:export const placesRetriever = defineFirestoreRetriever(ai, { name: 'placesRetriever', firestore, collection: 'places', contentField: 'knownFor', vectorField: 'embedding', embedder: vertexAI.embedder('text-embedding-005', {outputDimensionality: 768}), distanceMeasure: 'COSINE', });
Testowanie wyszukiwarki
- W interfejsie deweloperskim Genkit otwórz moduł pobierania
retrievers/placesRetriever
. - Podaj to zapytanie:
{ "content": [ { "text": "UNESCO" } ] }
- Możesz też podać Opcje. Na przykład tak możesz określić, ile dokumentów ma zwrócić wyszukiwarka:
{ "limit": 4 }
- Kliknij Wykonaj.
Możesz dodatkowo filtrować dane poza podobieństwem, dodając klauzule where
do opcji.
8. Generowanie rozszerzone przez wyszukiwanie w zapisanych informacjach (RAG) za pomocą Genkit
W poprzednich sekcjach utworzyliśmy pojedyncze prompty, które mogą obsługiwać tekst, JSON i obrazy, generując miejsca na wakacje i inne angażujące treści dla użytkowników. Wdrożono też prompt, który pobiera odpowiednie miejsca docelowe z bazy danych Firestore. Teraz nadszedł czas, aby połączyć te komponenty w spójny proces generowania rozszerzonego przez wyszukiwanie w zapisanych informacjach (RAG).
W tej sekcji przedstawiamy ważne pojęcie Genkit, czyli przepływy. Flows to funkcje z silnym typowaniem, które można przesyłać strumieniowo i wywoływać lokalnie oraz zdalnie, z pełną możliwością obserwacji. Przepływami możesz zarządzać i wywoływać je zarówno za pomocą interfejsu wiersza poleceń Genkit, jak i interfejsu programisty Genkit.
- W edytorze kodu sprawdź prompt dotyczący planu podróży:
- Otwórz plik
prompts/itineraryGen.prompt
. - Zwróć uwagę, że prompt został rozszerzony, aby akceptować dodatkowe dane wejściowe, w szczególności dane activities pochodzące z wyszukiwarki.
- Otwórz plik
- W interfejsie deweloperskim Genkit wyświetl przepływ Genkit w pliku
src/lib/genkit/itineraryFlow.ts
.
Wskazówka: aby usprawnić debugowanie, rozważ podzielenie długich przepływów na mniejsze, łatwiejsze do zarządzania kroki. - Ulepsz przepływ, integrując krok „opis obrazu”:
- Znajdź
TODO: 2
komentarz (około wiersza 81). W ten sposób oznaczysz miejsce, w którym chcesz ulepszyć swój przepływ. - Zastąp pusty obiekt zastępczy
imgDescription
wynikiem wygenerowanym przez wywołanie promptaimgDescription
.
- Znajdź
- Przetestuj proces:
- Otwórz
flows/itineraryFlow
. - Aby sprawdzić, czy funkcja
itineraryFlow
została wykonana prawidłowo w nowo dodanym kroku, użyj tego wejścia:{ "request": "Sightseeing in Paris", "imageUrls": [ "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4b/La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg/556px-La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg" ] }
- Kliknij Wykonaj.
- Sprawdź wygenerowane wyniki, które powinny zawierać opis obrazu w sugestii dotyczącej planu podróży.
- Otwórz
- Jeśli napotkasz błędy lub nieoczekiwane zachowania, szczegóły znajdziesz na karcie Sprawdź. Na tej karcie możesz też sprawdzić historię wykonań z Trace Store.
RAG w aplikacji internetowej
- Sprawdź, czy aplikacja internetowa nadal działa, otwierając w przeglądarce adres http://localhost:3000/.
- Jeśli aplikacja internetowa nie działa, uruchom w terminalu te polecenia:
npm install npm run dev
- Otwórz stronę aplikacji internetowej Dream Your Vacation (http://localhost:3000/gemini).
- Zobacz jego kod źródłowy (
src/app/gemini/page.tsx
), aby zapoznać się z przykładem integracji z Next.js.
9. Wdrażanie aplikacji za pomocą Firebase App Hosting
Ostatnim krokiem jest wdrożenie aplikacji internetowej. Wykorzystasz Firebase App Hosting, czyli rozwiązanie hostingowe z obsługą frameworków, które upraszcza wdrażanie aplikacji Next.js i Angular na backendzie bezserwerowym.
- Zatwierdź zmiany w lokalnym repozytorium Git, a następnie wypchnij je do GitHuba.
- W konsoli Firebase w projekcie Firebase otwórz Hosting aplikacji.
- Kliknij Rozpocznij > Połącz z GitHub.
- Wybierz konto GitHub i repozytorium. Kliknij Dalej.
- W sekcji Ustawienia wdrożenia > Katalog główny pozostaw wartość domyślną.
- W przypadku gałęzi Live wybierz gałąź main w repozytorium GitHub. Kliknij Dalej.
- Wpisz identyfikator backendu (np.
compass
). - Gdy pojawi się pytanie, czy chcesz utworzyć lub powiązać aplikację internetową Firebase, wybierz Wybierz istniejącą aplikację internetową Firebase i wskaż aplikację utworzoną w poprzednim kroku tego kursu.
- Kliknij Zakończ i wdroż.
Monitorowanie stanu wdrożenia
Proces wdrażania potrwa kilka minut. Postępy możesz śledzić w sekcji Hosting aplikacji w konsoli Firebase.
Przyznawanie uprawnień kontu usługi
Aby backend Node.js miał dostęp do zasobów Vertex AI, musisz przypisać rolę aiplatform.user
do konta usługi aplikacji:
gcloud projects add-iam-policy-binding YOUR_PROJECT_ID \
--member "serviceAccount:firebase-app-hosting-compute@YOUR_PROJECT_ID.iam.gserviceaccount.com" \
--role "roles/aiplatform.user"
Po zakończeniu tego procesu aplikacja internetowa będzie dostępna dla użytkowników.
Automatyczne ponowne wdrażanie
Firebase App Hosting upraszcza przyszłe aktualizacje. Za każdym razem, gdy wypchniesz zmiany do głównej gałęzi repozytorium GitHub, Firebase App Hosting automatycznie ponownie skompiluje i wdroży Twoją aplikację, dzięki czemu użytkownicy zawsze będą korzystać z najnowszej wersji.
10. Podsumowanie
Gratulujemy ukończenia tego obszernego ćwiczenia!
Udało Ci się wykorzystać potencjał Genkit, Firestore i Vertex AI do utworzenia zaawansowanego „przepływu”, który generuje spersonalizowane rekomendacje dotyczące wakacji na podstawie preferencji i inspiracji użytkownika, a jednocześnie opiera sugestie na danych z Twojej aplikacji.
Podczas tej ścieżki szkoleniowej zdobędziesz praktyczne doświadczenie w zakresie podstawowych wzorców inżynierii oprogramowania, które są kluczowe przy tworzeniu niezawodnych aplikacji generatywnej AI. Obejmują one:
- Zarządzanie promptami: organizowanie i utrzymywanie promptów w formie kodu w celu ułatwienia współpracy i kontroli wersji.
- Treści multimodalne: integrowanie różnych typów danych, takich jak obrazy i tekst, w celu ulepszenia interakcji z AI.
- Schematy wejścia/wyjścia: strukturyzowanie danych na potrzeby płynnej integracji i weryfikacji w aplikacji.
- Bazy danych wektorowych: wykorzystują wektory dystrybucyjne do wydajnego wyszukiwania podobieństw i pobierania odpowiednich informacji.
- Pobieranie danych: wdrażanie mechanizmów pobierania i włączania danych z baz danych do treści generowanych przez AI.
- Generowanie rozszerzone przez wyszukiwanie w zapisanych informacjach (RAG): łączenie technik wyszukiwania z generatywną AI w celu uzyskania trafnych i dokładnych wyników.
- Instrumentacja przepływu: tworzenie złożonych przepływów pracy AI i zarządzanie nimi w celu zapewnienia płynnego i przejrzystego wykonywania.
Opanowanie tych koncepcji i wykorzystanie ich w ekosystemie Firebase przygotuje Cię do rozpoczęcia własnych przygód z generatywną AI. Odkrywaj ogromne możliwości, twórz innowacyjne aplikacje i przesuwaj granice tego, co można osiągnąć dzięki generatywnej AI.
Poznawanie alternatywnych opcji wdrażania
Genkit oferuje różne opcje wdrażania, które odpowiadają Twoim konkretnym potrzebom, m.in.:
- Cloud Functions dla Firebase
- Cloud Run
- Next.js
- Dowolne środowisko Node.js
- Genkit obsługuje też język Go.
Wybierz odpowiednią opcję, uruchamiając to polecenie w folderze węzła (package.json
):
npx genkit init
Dalsze kroki
- Eksperymentuj z promptami i korzystaj z dużych okien kontekstu w Google AI Studio lub Vertex AI Studio.
- Dowiedz się więcej o wyszukiwaniu z generowaniem rozszerzonym przez wyszukiwanie w zapisanych informacjach (RAG).
- Zapoznaj się z oficjalną dokumentacją Genkit.
- Dowiedz się więcej o możliwościach wyszukiwania podobieństw w Firestore i Cloud SQL for PostgreSQL.
- Poznaj lepiej przepływy generatywnej AI dzięki wywoływaniu funkcji.