Wyobraź sobie: użytkownik wchodzi na Twoją stronę o 23:00, ma pytanie o cennik. Nie chce szukać w FAQ, nie chce pisać maila. Klika ikonkę czatu w rogu ekranu, pisze pytanie — i dostaje odpowiedź w 2 sekundy. AI zna Twój cennik, Twoje funkcje, Twoje terminy.
Co więcej — widget pamięta rozmowę. Użytkownik zamyka kartę, wraca następnego dnia — historia jest nadal na miejscu (localStorage). Bez logowania, bez konta, bez bazy danych po stronie serwera.
Architektura — jak to działa
flow rozmowy
1. User klika FAB → openChat() → ładuje historię z localStorage 2. User pisze pytanie → sendMessage() 3. JS wysyła POST /api/ai-chat.php z historią rozmowy 4. PHP: sprawdź rate limit → sprawdź cache → local FAQ match → Claude API 5. Claude odpowiada → PHP cache + admin review → JSON response 6. JS: formatAIMessage() → HTML → addMessage() → scroll 7. Zapisz do localStorage (max 20 wiadomości)
| Plik | Rola |
|---|---|
ai-widget.js | Cała logika widgetu: UI, Canvas animacje, CSS, formatowanie (~1850 linii) |
ai-chat.php | Endpoint POST: CORS, rate limit, historia rozmowy (max 10 wiadomości) |
AIAssistant.php | Klasa PHP: Claude API, cache, FAQ, admin review |
ai-config.php | Klucz API + system prompt (NIE w repo!) |
{domena}.json | Per-domena: texty, sugestie, kolory, baza FAQ |
lock
Ten poradnik wymaga konta Pro
Dostęp do zaawansowanych poradników, kodu źródłowego i wsparcia technicznego.