Dokumentacja
Kompletny przewodnik po wdrażaniu i zarządzaniu swoim portfolio fotograficznym Galleria.
Jak zacząć
Galleria to nowoczesna strona portfolio fotograficznego stworzona z użyciem React 19, TypeScript, Express 5 i SQLite. Oferuje zoptymalizowaną dostawę obrazów, panel administracyjny, śledzenie analityki i responsywny design.
Szybkie linki
- Przewodnik instalacji - Rozpocznij pracę z Dockerem lub konfiguracją deweloperską
- Demo na żywo - Zobacz Galleria w akcji
- Repozytorium GitHub - Kod źródłowy i przykłady
Konfiguracja Google OAuth SSO
Włącz Google OAuth Single Sign-On dla bezpiecznej, bezhasłowej autoryzacji do panelu administracyjnego Galleria.
Krok 1: Utwórz projekt w Google Cloud
- Przejdź do konsoli Google Cloud
- Utwórz nowy projekt lub wybierz istniejący
- Przejdź do API i usługi → Poświadczenia
- Kliknij Utwórz poświadczenia → Identyfikator klienta OAuth
- Jeśli zostaniesz o to poproszony, najpierw skonfiguruj ekran zgody OAuth
Krok 2: Skonfiguruj klienta OAuth
- Wybierz aplikację internetową jako typ aplikacji
- Dodaj swoją domenę do Dozwolonych źródeł JavaScript:
https://yourdomain.com - Dodaj adres URL zwrotny do Dozwolonych URI przekierowań:
https://yourdomain.com/api/auth/google/callback - Kliknij Utwórz i zapisz swoje poświadczenia
Krok 3: Skonfiguruj w ustawieniach Galleria
- Zaloguj się do swojego panelu administracyjnego Galleria
- Przejdź do Ustawienia → Google OAuth
- Wprowadź swój identyfikator klienta Google
- Wprowadź swój tajny klucz klienta Google
- Kliknij Zapisz, aby włączyć Google OAuth SSO
Automatyczna konwersja użytkowników: Istniejący użytkownicy z pasującymi adresami e-mail będą automatycznie konwertowani na uwierzytelnianie Google OAuth. Mogą zalogować się za pomocą Google natychmiast po skonfigurowaniu OAuth.
Wskazówka dotycząca bezpieczeństwa: Dodawaj tylko zaufane adresy e-mail jako użytkowników administracyjnych. Możesz zarządzać dostępem użytkowników z panelu administracyjnego po początkowej konfiguracji.
Konfiguracja OpenObserve Analytics
OpenObserve zapewnia potężną analizę logów i monitorowanie w czasie rzeczywistym dla Twojej strony internetowej Galleria z możliwościami wzbogacania geograficznego.
Krok 1: Zainstaluj OpenObserve za pomocą Dockera
Uruchom OpenObserve za pomocą Docker Compose:
Krok 2: Utwórz konto usługi
- Uzyskaj dostęp do OpenObserve pod adresem http://localhost:5080
- Zaloguj się za pomocą swoich danych administracyjnych
- Przejdź do Ustawienia → Konta usługi
- Kliknij Utwórz konto usługi
- Nadaj mu nazwę (np. "galleria-analytics") i przypisz odpowiednie uprawnienia
- Skopiuj wygenerowany token API do późniejszego użycia
Krok 7: Skonfiguruj Galleria
- Zaloguj się do swojego panelu administracyjnego Galleria
- Przejdź do Ustawienia → Analityka
- Wprowadź swój adres URL OpenObserve (np. http://localhost:5080)
- Wprowadź swój identyfikator organizacji
- Wprowadź swoją nazwę strumienia (strona internetowa)
- Wprowadź swoją nazwę użytkownika (z kroku 2)
- Wprowadź swoje hasło (token konta usługi z kroku 2)
- Kliknij Zapisz, aby włączyć analitykę OpenObserve
Sukces! Twoja analityka będzie teraz zawierać dane wzbogacone o geolokalizację z miastem, regionem, krajem, ISP i współrzędnymi dla wszystkich odwiedzających.
Sprzętowe kodowanie wideo
Galleria wspiera sprzętowe przyspieszenie kodowania wideo, co pozwala na 5-10 razy szybsze przetwarzanie wideo przy użyciu twojego GPU.
Obsługiwany sprzęt
GPU NVIDIA (NVENC)
Wsparcie dla Dockera i natywne
Intel Quick Sync (QSV)
Tylko wsparcie natywne
GPU AMD (AMF)
Tylko wsparcie natywne
Apple VideoToolbox
Tylko natywne dla macOS
Włącz kodowanie sprzętowe
- Przejdź do Panelu administracyjnego → Ustawienia → Jakość wideo
- Przełącz "Transkodowanie sprzętowe" na włączone
- Przetwarzanie wideo będzie teraz korzystać z akceleracji GPU, gdy będzie dostępna
Wdrożenie produkcyjne
Używając PM2
Dla wdrożenia produkcyjnego bez Dockera:
npm run build
npm install -g pm2
pm2 start ecosystem.config.cjs
pm2 save
pm2 startupAutomatyczne wdrożenie: Wypchnij do gałęzi master, a GitHub Actions automatycznie wdroży twoje zmiany.
Pomóż poprawić tę dokumentację
Znalazłeś błąd lub chcesz wnieść wkład w dokumentację? Zapraszamy do współpracy!
Wnieś wkład na GitHubie