Документация
Полное руководство по развертыванию и управлению вашим портфолио фотографий Galleria.
Начало работы
Galleria - это современный сайт портфолио фотографий, созданный с использованием React 19, TypeScript, Express 5 и SQLite. Он предлагает оптимизированную доставку изображений, панель администратора, отслеживание аналитики и адаптивный дизайн.
Быстрые ссылки
- Руководство по установке - Начните работу с Docker или настройкой разработки
- Живая демонстрация - Смотрите Galleria в действии
- Репозиторий GitHub - Исходный код и примеры
Настройка Google OAuth SSO
Включите Google OAuth Single Sign-On для безопасной аутентификации без пароля в вашей админ-панели Galleria.
Шаг 1: Создайте проект в Google Cloud
- Перейдите в Google Cloud Console
- Создайте новый проект или выберите существующий
- Перейдите в APIs & Services → Credentials
- Нажмите Создать учетные данные → OAuth client ID
- Если будет предложено, сначала настройте экран согласия OAuth
Шаг 2: Настройка OAuth клиента
- Выберите Веб-приложение в качестве типа приложения
- Добавьте ваш домен в Разрешенные JavaScript источники:
https://yourdomain.com - Добавьте URL-адрес обратного вызова в Разрешенные URI перенаправления:
https://yourdomain.com/api/auth/google/callback - Нажмите Создать и сохраните ваши учетные данные
Шаг 3: Настройка в настройках Galleria
- Войдите в вашу админ-панель Galleria
- Перейдите в Настройки → Google OAuth
- Введите ваш Google Client ID
- Введите ваш Google Client Secret
- Нажмите Сохранить, чтобы включить Google OAuth SSO
Автоматическое преобразование пользователей: Существующие пользователи с совпадающими адресами электронной почты будут автоматически преобразованы в аутентификацию Google OAuth. Они могут войти с помощью Google сразу после настройки OAuth.
Совет по безопасности: Добавляйте только доверенные адреса электронной почты в качестве администраторов. Вы можете управлять доступом пользователей из административной панели после первоначальной настройки.
Настройка OpenObserve Analytics
OpenObserve предоставляет мощную аналитику логов и мониторинг в реальном времени для вашего сайта Galleria с возможностями геообогащения.
Шаг 1: Установите OpenObserve с помощью Docker
Запустите OpenObserve с использованием Docker Compose:
Шаг 2: Создайте учетную запись службы
- Получите доступ к OpenObserve по адресу http://localhost:5080
- Войдите с вашими учетными данными администратора
- Перейдите в Настройки → Учетные записи служб
- Нажмите Создать учетную запись службы
- Дайте ей имя (например, "galleria-analytics") и назначьте соответствующие разрешения
- Скопируйте сгенерированный API токен для последующего использования
Шаг 7: Настройка Galleria
- Войдите в панель администратора Galleria
- Перейдите в Настройки → Аналитика
- Введите ваш URL OpenObserve (например, http://localhost:5080)
- Введите ваш ID организации
- Введите название вашего потока (вебсайт)
- Введите ваше имя пользователя (из Шага 2)
- Введите ваш пароль (токен сервисной учетной записи из Шага 2)
- Нажмите Сохранить, чтобы включить аналитику OpenObserve
Успех! Ваша аналитика теперь будет включать геообогащенные данные с городом, регионом, страной, провайдером интернет-услуг и координатами для всех посетителей.
Аппаратное видеокодирование
Galleria поддерживает аппаратное видеокодирование с аппаратным ускорением для 5-10 раз более быстрого видеопроцессинга с использованием вашего GPU.
Поддерживаемое оборудование
GPU NVIDIA (NVENC)
Поддержка Docker и нативная поддержка
Intel Quick Sync (QSV)
Только нативная поддержка
Графические процессоры AMD (AMF)
Только нативная поддержка
Apple VideoToolbox
Только нативный macOS
Включить аппаратное кодирование
- Перейдите в Панель администратора → Настройки → Качество видео
- Переключите "Аппаратное транскодирование" на включено
- Обработка видео теперь будет использовать аппаратное ускорение, когда это возможно
Развертывание в производственной среде
Используя PM2
Для развертывания в производственной среде без Docker:
npm run build
npm install -g pm2
pm2 start ecosystem.config.cjs
pm2 save
pm2 startupАвтоматизированное развертывание: отправьте в основную ветку, и GitHub Actions автоматически развернет ваши изменения.
Помогите улучшить эту документацию
Нашли ошибку или хотите внести свой вклад в документацию? Мы приветствуем ваши предложения!
Внести вклад на GitHub