Web Shop / О решении
  На главную

Web Shop

Настройка аутентификации пользователя

Аутентификация позволяет пользователю покупать товары в Web Shop и видеть уникальные предложения в каталоге.

Основные возможности Web Shop с аутентификацией:

  • Поддержка множества способов авторизации в Web Shop.
  • Настройка персонализированных витрин и промокодов для авторизованных пользователей.
  • Соблюдение местного законодательства по защите и обработке персональных данных.
  • Ограничение частоты запросов и защита от DDoS-атак.

Вы можете выбрать один из следующих способов аутентификации пользователя:

  • Аутентификация через ID пользователя:
    • Упрощает интеграцию Web Shop с игрой.
    • Виджет аутентификации через ID пользователя не требует регистрации и ввода пароля — пользователю достаточно ввести свой ID из игры или использовать для входа тот же аккаунт социальной сети, что и для входа в игру.

Примечание
Используйте аутентификацию через ID пользователя, если в игре не настроен Xsolla Login.
  • Аутентификация через ID пользователя и диплинк:
    • Диплинки можно использовать в качестве дополнительного метода авторизации при входе через ID пользователя.
    • Виджет аутентификации через ID пользователя и диплинк не требует регистрации и ввода пароля — пользователю достаточно ввести свой ID из игры или войти через игру с помощью диплинка.
Примечание
Используйте аутентификацию через ID пользователя и диплинк, если в игре реализована поддержка диплинков для аутентификации.
  • Аутентификация через диплинк:
      Когда диплинк используется как основной способ входа, он позволяет сохранять платежные данные, чего нельзя сделать при авторизации через ID пользователя.
Примечание
Используйте аутентификацию диплинк, если в игре реализована поддержка диплинков для аутентификации.
  • Аутентификация пользователя через Xsolla Login:
    • Предоставляет широкий выбор способов авторизации: через социальные сети, с помощью одноразовых кодов или ссылок, с помощью ввода логина и пароля.
    • Виджет Xsolla Login поддерживает кастомизацию.
    • Позволяет вводить возрастные ограничения на авторизацию.
Примечание
Используйте аутентификацию пользователя через Xsolla Login, если этот продукт уже настроен в игре.
При любом способе аутентификации вы можете добавить блок Быстрого входа на ваш сайт.

Сценарий пользователя

  1. Пользователь переходит в Web Shop с настроенной аутентификацией через ID пользователя.
  2. Пользователь авторизуется в Web Shop одним из способов:
    • Пользователь вводит свой ID в блоке Быстрый вход и нажимает кнопку входа.
    • Пользователь нажимает кнопку покупки у выбранного товара или кнопку входа в верхней панели:
      1. Открывается модальное окно ввода ID пользователя или входа через социальную сеть.
      2. Пользователь вводит свой ID и нажимает Продолжить или выбирает одну из социальных сетей, нажав значок социальной сети, и проходит аутентификацию на странице социальной сети.
    1. Выполняется проверка существования пользователя. Если пользователь с указанным ID или аккаунтом социальной сети существует в игре, пользователь будет авторизован в Web Shop. В противном случае пользователь получит сообщение об ошибке.

    Как настроить

    1. В вашем приложении реализуйте обработку вебхука для проверки существования пользователя.

    При получении вебхука приложение должно выполнять следующие действия:

    • Поиск пользователя по полученному в вебхуке ID пользователя.
    • Отправка одного из кодов статуса в зависимости от результатов поиска пользователя:
      • 200 HTTP-код с ответом вебхука, если пользователь найден;
      • 404 HTTP-код, если пользователь с таким ID не зарегистрирован в игре.
    • Отправка атрибутов пользователя для персонализации.

    Примечание
    ID пользователя должен быть уникальным для каждого пользователя.
    1. Откройте проект в Личном кабинете.
    2. В боковом меню нажмите Site Builder.
    3. Нажмите Открыть Site Builder.
    4. В конструкторе вашего сайта перейдите в блок Настройки входа.
    1. Выберите вариант ID пользователя.
    Примечание
    Настройки кастомизации виджета в проекте Login не влияют на интерфейс виджета аутентификации через ID пользователя.
    1. В раскрывающемся списке выберите Новый вариант Авторизации.
    1. Введите URL-адрес, на который вы хотите получать вебхуки.
    Примечание
    URL-адрес вебхука должен начинаться с https://. Протокол http:// не поддерживается.
    Примечание
    Хранилище Xsolla является хранилищем данных пользователей по умолчанию. Рекомендуется не менять его в Личном кабинете. С этим типом хранилища вам будут доступны более гибкие настройки.
    1. Настройте авторизацию через социальные сети, которые используются для авторизации в вашем приложении (опционально):
      1. Откройте проект в Личном кабинете и перейдите в раздел Login.
      2. Нажмите Настроить в панели нужного варианта авторизации.
      3. На странице навигации перейдите к блоку Аутентификация и выберите раздел Авторизация через социальные сети.
      1. Чтобы подключить социальную сеть, в карточке социальной сети нажмите значок ⚙ справа от названия и выберите пункт Подключить.
    Примечание
    Для использования авторизации через социальные сети в проекте укажите ID и секретный ключ вашего приложения в настройках карточки социальной сети. ID и секретный ключ приложения находятся в аккаунте разработчика социального провайдера. Подробную инструкцию по получению ID и секретного ключа можно найти в настройках карточки социальной сети в Личном кабинете.

    Настройка блока Быстрый вход

    Блок Быстрый вход предоставляет пользователям дополнительный способ аутентификации на сайте.

    Внешний вид блока и его возможности зависят от выбранного способа аутентификации.

    Если на сайте настроена аутентификация через ID пользователя, в блоке Быстрый вход отображается поле для ввода ID и кнопка входа.

    Возможности:

    • Аутентификация пользователя без дополнительного перехода в модальное окно.
    • Настройка содержимого блока. Вы можете включить и настроить следующие разделы:
      • Заголовок.
      • Описание.
      • Инструкция, как найти ID пользователя.
      • Пользовательский фон.

    Вы также можете расширить возможности блока, например добавить текст, кнопку или изображение с помощью JS-кода.

    Если на сайте настроена аутентификация через Xsolla Login, в блоке Быстрый вход отображается дополнительная кнопка призыва к авторизации. При нажатии на кнопку в блоке будет открыто модальное окно для авторизации одним из способов Xsolla Login.

    Возможности:

    • Настройка текста кнопки, призывающей к авторизации.
    • Настройка пользовательского фона.

    Вы также можете расширить возможности блока, например добавить текст, кнопку или изображение с помощью JS-кода.

    Для новых сайтов в шаблоне Web Shop блок Быстрый вход добавляется по умолчанию, при необходимости вы можете удалить его.

    Если вы создавали сайт ранее и в нем нет блока Быстрый вход, вы можете его добавить.

    Чтобы добавить блок Быстрый вход:

    1. Откройте проект в Личном кабинете.
    2. В боковом меню нажмите Конструктор сайтов.
    3. В разделе Сайты выберите ваш сайт и нажмите Открыть Конструктор сайтов.
    4. Нажмите Добавить блок.
    5. Выберите блок Быстрый вход.
    Примечание

    Для использования блока Быстрый вход должен быть предварительно выбран вариант авторизации в раскрывающемся списке в разделе Настройки входа.

    Для способа аутентификации через ID пользователя в разделе Настройки входа также необходимо указать URL-адрес, на который вы хотите получать вебхук. Если не указать его, сайт не может быть опубликован, так как аутентификация пользователей будет недоступна.

    Аутентификация пользователей при предварительном просмотре сайта возможна без добавления URL-адреса вебхука.

    Следующие шаги

    1. Проверьте работу Web Shop в тестовом окружении.
    2. Опубликуйте сайт.

    Сценарий интеграции

    Была ли статья полезна?
    Спасибо!
    Что может сделать страницу еще лучше? Сообщение
    Жаль, что так произошло
    Расскажите, почему статья не была полезна. Сообщение
    Спасибо за обратную связь!
    Ваши мысли и идеи помогут нам улучшить ваш пользовательский опыт.
    Последнее обновление: 13 марта 2025

    Нашли опечатку или ошибку в тексте? Выделите ее и нажмите Ctrl+Enter.

    Сообщите о проблеме
    Мы постоянно улучшаем качество нашей документации. Ваш отзыв поможет нам в этом.
    Укажите email-адрес, чтобы мы могли связаться с вами
    Спасибо за обратную связь!
    Не получилось отправить ваш комментарий
    Попробуйте еще раз позже или напишите нам на doc_feedback@xsolla.com.