Skip to Content
Flute CMS v1.0.0 — Получить ключ доступа
РуководстваСоциальная авторизация

Настройка авторизации через социальные сети

Что такое авторизация через социальные сети?

Авторизация через социальные сети (OAuth-авторизация) позволяет пользователям входить на ваш сайт, используя свои существующие аккаунты в популярных сервисах — Discord, Google, GitHub и других. Вместо того чтобы придумывать новый пароль, пользователь просто нажимает кнопку «Войти через…» и подтверждает вход в знакомом ему сервисе.

Зачем это нужно?

  • Удобство для пользователей — не нужно запоминать ещё один пароль.
  • Быстрая регистрация — вход в пару кликов вместо заполнения формы.
  • Безопасность — пароли пользователей не хранятся на вашем сайте, а авторизация проходит через защищённые серверы крупных компаний.

Как это работает? (простым языком)

Когда пользователь нажимает «Войти через Discord» (или другой сервис), происходит следующее:

  1. Пользователь перенаправляется на сайт сервиса (например, Discord).
  2. Сервис спрашивает: «Вы разрешаете сайту X получить ваш email и имя?»
  3. Пользователь нажимает «Разрешить».
  4. Сервис перенаправляет пользователя обратно на ваш сайт и передаёт специальный код.
  5. Ваш сайт (Flute CMS) использует этот код, чтобы получить данные пользователя.

Чтобы этот процесс работал, вам нужно зарегистрировать своё приложение в каждом сервисе и получить два ключа:

  • Client ID (идентификатор приложения) — публичный ключ, который говорит сервису: «Это сайт X».
  • Client Secret (секретный ключ) — приватный ключ, который подтверждает, что вы действительно владелец этого приложения. Никому его не показывайте!

Для настройки социальной авторизации вам нужны права admin.social или admin.boss в Flute CMS.

Поддерживаемые сервисы

Flute CMS поддерживает авторизацию через следующие сервисы:

  • Discord — популярен среди геймеров, идеален для игровых сообществ
  • Steam — для игровых сообществ (работает по-другому, через OpenID)
  • Google — универсальный вариант, есть у большинства пользователей
  • GitHub — для сообществ разработчиков
  • ВКонтакте — популярен в России и СНГ
  • Яндекс — популярен в России и СНГ

Если нужного сервиса нет в списке, вы можете предложить его добавить в нашем Discord-сообществе .

Общие требования

Прежде чем приступить к настройке, убедитесь, что:

  • HTTPS настроен — подавляющее большинство сервисов требуют, чтобы ваш сайт работал по защищённому протоколу HTTPS. Без SSL-сертификата авторизация не заработает (исключение — localhost для тестирования в некоторых сервисах).
  • У вас есть реальный домен — большинство сервисов не принимают IP-адреса или localhost в качестве адреса сайта.
  • Домен везде одинаковый — используйте один и тот же вариант домена (с www или без) и в настройках сервиса, и в Flute CMS.

Где находятся настройки в Flute CMS

Страница управления социальными сетями находится в админ-панели: в боковом меню найдите раздел «Интеграции» и выберите пункт «Социальные сети».

Путь: Админ-панель → Социальные сети (в разделе «Интеграции» бокового меню)

Страница социальных сетей в админ-панели Flute CMS

На этой странице вы увидите таблицу со всеми доступными сервисами. У каждого сервиса есть:

  • Соц.сеть — название сервиса
  • Время ожидания — таймаут подключения
  • Регистрация — разрешена ли регистрация через этот сервис
  • Статус — включен или выключен сервис
  • Действия — кнопки для настройки и управления

Чтобы добавить новый сервис, нажмите кнопку «+ Добавить» в правом верхнем углу страницы.

Для настройки уже добавленного сервиса нажмите на кнопку действий (шестерёнку или иконку настроек) рядом с нужным сервисом.

Окно настройки социальной сети

Redirect URI (адреса перенаправления)

При регистрации приложения в каждом сервисе вам потребуется указать Redirect URI — адреса, на которые сервис будет перенаправлять пользователя после авторизации. Во Flute CMS используются два адреса для каждого сервиса:

  • https://ваш-домен.ru/social/{Название} — для входа на сайт
  • https://ваш-домен.ru/profile/social/bind/{Название} — для привязки соцсети к существующему аккаунту

Где {Название} — это имя сервиса с заглавной буквы: Discord, Google, GitHub, Vkontakte, Yandex.

Redirect URI должны точно совпадать с тем, что вы указали в настройках сервиса — вплоть до символа. Разница в одном символе (например, лишний / в конце) приведёт к ошибке.

Настройка каждого сервиса

Настройка Discord

Discord — один из самых популярных сервисов для авторизации в игровых сообществах.

Создайте приложение в Discord

  1. Откройте Discord Developer Portal  и войдите в свой Discord-аккаунт.
  2. Нажмите кнопку «New Application» в правом верхнем углу.
  3. Введите название приложения (например, название вашего сайта) и нажмите «Create».

Получите Client ID и Client Secret

  1. В левом меню приложения перейдите в раздел «OAuth2».
  2. Скопируйте Client ID — он отображается на странице сразу.
  3. Нажмите «Reset Secret», чтобы сгенерировать Client Secret, и скопируйте его.

Client Secret показывается только один раз! Сразу скопируйте и сохраните его. Если потеряете — придётся генерировать новый через «Reset Secret».

Добавьте Redirect URI

  1. На той же странице «OAuth2» найдите блок «Redirects».
  2. Нажмите «Add Redirect» и добавьте два адреса:
    • https://ваш-домен.ru/social/Discord
    • https://ваш-домен.ru/profile/social/bind/Discord
  3. Нажмите «Save Changes» внизу страницы.

Если ваш сайт доступен и по example.com, и по www.example.com, добавьте Redirect URI для обоих вариантов, чтобы избежать ошибки redirect_uri_mismatch.

Введите данные в Flute CMS

  1. Откройте Админ-панель → Социальные сети (в разделе «Интеграции» бокового меню).
  2. Найдите Discord в списке (или нажмите «+ Добавить», если его нет).
  3. Введите скопированные Client ID и Client Secret.
  4. Нажмите «Сохранить».

Решение типичных проблем

Ошибка “redirect_uri_mismatch”

Причина: Redirect URI, указанный в настройках сервиса (Discord, Google и т.д.), не совпадает с тем, что отправляет Flute CMS.

Как исправить:

  • Проверьте, что URI совпадают посимвольно — включая протокол (https://), наличие или отсутствие www, и отсутствие лишнего / в конце.
  • Если ваш сайт доступен по нескольким адресам (с www и без), добавьте Redirect URI для каждого варианта.
  • Убедитесь, что в Flute CMS и в настройках сервиса указан один и тот же домен.

Ошибка “invalid_client”

Причина: Неверный Client ID или Client Secret.

Как исправить:

  • Вернитесь в панель разработчика сервиса и заново скопируйте ключи.
  • Убедитесь, что при копировании не захватили лишние пробелы.
  • Если Client Secret был сброшен (reset), старый перестаёт работать — используйте новый.

Авторизация не работает, страница просто перезагружается

Причина: Скорее всего, проблема с HTTPS или неверными redirect URI.

Как исправить:

  • Убедитесь, что ваш сайт работает по HTTPS с действующим SSL-сертификатом.
  • Проверьте, что redirect URI в сервисе указаны с https://, а не http://.

Steam авторизация не работает

Причина: Не указан или неверно указан Steam API Key.

Как исправить:

  • Откройте Админ-панель → Основные настройки и проверьте поле «STEAM API ключ».
  • Убедитесь, что API-ключ действителен на странице Steam Web API Key .

Авторизация не работает на localhost

Причина: Большинство сервисов не принимают localhost в качестве адреса для OAuth.

Как исправить:

  • Используйте реальный домен для тестирования.
  • Как временное решение, настройте локальный домен через файл hosts на вашем компьютере.
  • Google разрешает использование localhost для тестирования — это исключение.

Если после выполнения всех шагов авторизация всё равно не работает, обратитесь за помощью в наше Discord-сообщество . Приложите скриншоты настроек и описание ошибки — вам обязательно помогут.

Платёжные системыРоли пользователей