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, если этот продукт уже настроен в игре.
При любом способе аутентификации вы можете добавить блок Быстрого входа на ваш сайт.

Диплинк — это специальный URL, который ведет пользователя не просто на главную страницу приложения или сайта, а сразу на конкретный раздел, страницу или выполняет определенное действие.

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

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

  1. Неавторизованный пользователь в Web Shop нажимает кнопку входа или кнопку покупки. Открывается модальное окно ввода ID пользователя или входа через мобильную игру.
  1. Пользователь нажимает кнопку входа через игру.
  2. Пользователь автоматически перенаправляется в игру, а оттуда — в Web Shop как авторизованный пользователь.

  1. Неавторизованный пользователь в Web Shop нажимает кнопку входа или кнопку покупки. Открывается модальное окно ввода ID пользователя или входа в мобильную версию игры с помощью QR-кода.

  1. Пользователь сканирует QR-код с помощью мобильного устройства.
  2. На мобильном устройстве открывается Web Shop.
  3. Пользователь автоматически перенаправляется в игру, а оттуда — в Web Shop как авторизованный пользователь.
  1. В настройках вашей игры зарегистрируйте URL-схему для открытия игры через диплинк:
    • в приложениях под Android — в файле AndroidManifest.xml;
    • в приложениях под iOS — в файле Info.plist.

    После регистрации схемы, когда пользователь авторизуется в Web Shop через игру, по указанному адресу должна открываться игра.

    Пример URL-схемы для регистрации игры:
    gamename://authorize?operationPayload=<VALUE>, где:
    • gamename — название вашей игры, которая должна открываться на мобильном устройстве для авторизации пользователя.
    • authorize — действие, которое должно быть выполнено после открытия игры gamename. Используйте название действия, которое соответствует действиям в операционной системе вашего приложения.
    • operationPayload=<VALUE> — дополнительный параметр с информацией для генерации токена при авторизации.

    Примеры:
Copy
Full screen
Small screen
<key>CFBundleURLTypes</key>
  <array>
    <dict>
      <key>CFBundleTypeRole</key>
      <string>Editor</string>
      <key>CFBundleURLSchemes</key>
      <array>
        <string>gamename</string>
      </array>
    </dict>
  </array>

  1. Реализуйте генерацию авторизационного токена в формате JWT, используя ID пользователя из игры.

ПараметрТипОписание
loginId
stringID варианта авторизации из Личного кабинета. Обязательный.
settings.projectId
stringID проекта в Личном кабинете, который указан рядом с названием вашего проекта или в адресной строке браузера. URL-адрес имеет вид https://publisher.xsolla.com/<merchantId>/projects/<projectId>. Обязательный.
settings.merchantId
stringID продавца в Личном кабинете, который указан в разделе Настройки компании > Компания или в адресной строке браузера на любой странице Личного кабинета. URL-адрес имеет вид https://publisher.xsolla.com/<merchantId>/. Обязательный.
user.id
stringID пользователя в игре. Обязательный.
user.country
stringДвухбуквенное обозначение страны в верхнем регистре согласно стандарту ISO 3166-1 alpha-2. Ознакомьтесь со списком стран, поддерживаемых Xsolla, а также с процессом определения страны. Обязательный.
Пример: US
operationPayload
stringДополнительный параметр с информацией для генерации токена при авторизации. Обязательный.

    Пример вызова метода API генерации токена пользователя с использованием библиотеки curl:

Copy
Full screen
Small screen
curl -X 'POST' \
'https://sb-user-id-service.xsolla.com/api/v1/user-id/token' \
-H 'accept: /' \
-H 'Content-Type: application/json' \
-d '{
 "loginId": "000001aa-001a-0ab0-00001-01a01a01a01a",
 "settings": {
   "projectId": 123456,
   "merchantId": 123456
 },
 "user": {
   "id": "123",
   "country": "US"
 }
 "operationPayload": "kosarb2NyrtIWaegJAH1f6P7XrBYPXYDya5coc_ZzcfiS_5o4QTUAL-CcGRC_Kv4CAtg"
}'

    Вы получите ответ вида {token="JWT_TOKEN"}.

  1. Добавьте всплывающее окно с уведомлением об успешной авторизации (опционально).
  2. Реализуйте открытие Web Shop в браузере, используя полученный токен пользователя.

    Пример URL-адреса для открытия Web Shop в браузере для авторизованного пользователя:
    • https:​//example.com/?token={token}, если вы используете кастомный домен.
    • https:​//example.xsolla.site/?token={token}, если вы используете домен Xsolla.
    Где {token} — авторизационный токен пользователя.
Примечание
Предварительно настройте аутентификацию через ID пользователя. Это необходимо для того, чтобы у пользователей был альтернативный способ аутентификации, если аутентификация через диплинк недоступна. Например, если на мобильном устройстве не установлена игра.
  1. В проекте в Личном кабинете перейдите в раздел Site Builder.
  2. Нажмите Настроить в карточке вашего сайта Web Shop с аутентификацией через ID пользователя.
  3. Перейдите к блоку Настройки аутентификации и выберите раздел ID пользователя.
  4. Установите переключатель Авторизация по диплинку в активное положение.
  1. В поле URL диплинка укажите ссылку для авторизации пользователя.
  1. Если вы используете блок Быстрый вход на сайте:
    1. Перейдите к блоку Быстрый вход.
    2. В секции Настройки блока установите переключатель QR-код в активное положение.
  1. Для проверки авторизации нажмите Просмотр.
  2. Для публикации сайта нажмите Опубликовать.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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