Аутентификация пользователя через социальные сети
Вы можете реализовать в вашем приложении аутентификацию пользователя с помощью его аккаунта в социальной сети. Если пользователь входит в систему впервые через аккаунт социальной сети, новая учетная запись создается автоматически. Пользователю не требуется вводить имя пользователя, email-адрес или другие данные.
Coциальные сети:
- Аутентификация с помощью веб-сервисов. В этом случае приложение открывает в браузере форму для подтверждения аутентификации через выбранную социальную сеть. Способ подходит как для мобильных, так и для настольных приложений.
- Нативная аутентификация. В этом случае аутентификация выполняется через приложение социальной сети на устройстве пользователя. Способ подходит только для мобильных приложений.
Социальные сети могут быть как основным способом аутентификации в вашем приложении, так и альтернативным.
Если аккаунт социальной сети является альтернативным способом аутентификации, для автоматической привязки аккаунта к существующей учетной записи должны быть выполнены следующие условия:
- Пользователь, зарегистрированный с помощью имени пользователя или email-адреса, входит в приложение через аккаунт социальной сети.
- Социальная сеть возвращает email-адрес.
- Email-адрес из социальной сети совпадает с email-адресом, указанным пользователем при регистрации в вашем приложении.
Вы также можете реализовать ручную привязку аккаунта социальной сети.
Инструкции
Поддерживается авторизация через следующие социальные сети:
- Amazon
- Apple
- Baidu
- Battle.net
- Discord
- GitHub
- Kakao
- MSN
- Mail.ru
- Microsoft
- Naver
- Odnoklassniki
- PayPal
- Steam
- Twitch.tv
- VK
- Vimeo
- Xbox Live
- Yahoo
- Yandex
- YouTube
Чтобы настроить аутентификацию через веб-сервисы:
- В интерфейсе приложения добавьте кнопки для аутентификации через социальные сети.
- Настройте социальные сети для выбранного варианта авторизации в Личном кабинете.
- Реализуйте логику аутентификации на стороне приложения.
Настройка социальных сетей для варианта авторизации в Личном кабинете Xsolla
- Откройте ваш проект в Личном кабинете.
- В боковом меню выберите пункт Авторизация.
- Нажмите Настроить в панели нужного варианта авторизации.
- На странице навигации перейдите к блоку Аутентификация и выберите раздел Авторизация через социальные сети.
- Подключите социальные сети, через которые пользователи смогут регистрироваться и входить в приложение. Это можно сделать одним из следующих способов:
- Чтобы подключить нужную социальную сеть, нажмите значок ⚙ и выберите пункт Подключить.
- Чтобы подключить сразу несколько социальных сетей, выберите нужные панели (рамки панелей станут зелеными). Затем в раскрывающемся меню Управление выберите пункт Подключить.
- Чтобы подключить сразу все доступные социальные сети, нажмите Выбрать все. Затем в раскрывающемся меню Управление выберите пункт Подключить.
Интеграция на стороне приложения
Реализуйте следующую логику при нажатии кнопки аутентификации через социальную сеть:
- Для настольных приложений:
- Получите URL-адрес страницы регистрации/авторизации с помощью метода SDK
GetSocialNetworkAuthUrl
. - Откройте страницу регистрации/авторизации в браузере с помощью метода
BrowserHelper.Instance.InAppBrowser
. - Подпишитесь на событие изменения URL-адреса, для этого добавьте функцию обратного вызова
BrowserHelper.Instance.InAppBrowser.AddUrlChangeHandler(OnUrlChanged)
. - Отследите изменение URL-адреса страницы после успешной аутентификации пользователя.
- Получите код аутентификации из URL-адреса активной страницы. Для этого вы можете использовать вспомогательный метод SDK
ParseUtils.TryGetValueFromUrl()
. - Обменяйте код аутентификации на токен с помощью метода SDK
ExchangeCodeToToken
и используйте его в запросах к серверам Иксоллы.
- Получите URL-адрес страницы регистрации/авторизации с помощью метода SDK
Пример реализации описанной логики приведен в демопроекте в скрипте Assets/Xsolla.Demo/Login/Scripts/Login/Auth/SocialAuth.cs
.
Аутентификация через социальные сети недоступна с помощью внешнего браузера. В состав SDK включен встроенный браузер для настольных приложений, разработанный Иксоллой. Вы можете использовать его или любой другой браузер, позволяющий отслеживать изменения URL-адресов.
- Для Android-приложений:
- Создайте объект класса
AndroidSDKSocialAuthHelper
. - Вызовите метод
PerformSocialAuth
, передав в него параметры:SocialProvider
— название социальной сети;onSuccess
— функция, которая вызывается в случае успешной аутентификации пользователя;onCancelled
— функция, которая вызывается в случае отмены аутентификации пользователем;onError
— функция, которая вызывается в случае ошибки.
- Получите токен, который функция
onSuccess
вернет в параметреtoken
, и используйте его в запросах к серверам Иксоллы.
- Создайте объект класса
Assets/Xsolla.Demo/Login/Scripts/Login/Auth/AndroidSocialAuth.cs
.- Для iOS-приложений:
- Создайте объект класса
IosSDKSocialAuthHelper
. - Вызовите метод
PerformSocialAuth
, передав в него параметры:SocialProvider
— название социальной сети;onSuccess
— функция, которая вызывается в случае успешной аутентификации пользователя;onCancelled
— функция, которая вызывается в случае отмены аутентификации пользователем;onError
— функция, которая вызывается в случае ошибки.
- Получите токен, который функция
onSuccess
вернет в полеaccess_token
объектаLoginOAuthJsonResponse
, и используйте его в запросах к серверам Иксоллы.
- Создайте объект класса
Assets/Xsolla.Demo/Login/Scripts/Login/Auth/IosSocialAuth.cs
.Нативная авторизация позволяет пользователям войти в ваше приложение с помощью аккаунта социальной сети, настроенного на мобильном устройстве.
При первом входе пользователя запускается приложение социальной сети, которое запрашивает разрешение на аутентификацию пользователя. В дальнейшем аутентификация будет выполняться автоматически, без участия пользователя.
В настоящее время для SDK реализована нативная авторизация через следующие социальные сети:
Чтобы настроить нативную авторизацию:
- В интерфейсе приложения добавьте кнопки для аутентификации через социальные сети.
- Создайте сборку вашего проекта Unity под Android.
- Настройте приложение в личном кабинете разработчика социальной сети:
- Для авторизации через Facebook:
- Зарегистрируйтесь и создайте новое приложение.
- Настройте страницу приложения в личном кабинете разработчика Facebook.
- Для авторизации через Google настройте проект в Google API Console.
- Для авторизации через WeChat:
- Зарегистрируйтесь и создайте новое мобильное приложение.
- Отправьте приложение на проверку.
- Для авторизации через QQ:
- Зарегистрируйтесь и создайте новое мобильное приложение.
- Отправьте приложение на проверку.
- Для авторизации через Facebook:
- Настройте авторизацию через социальные сети на стороне Иксоллы:
- Для Facebook и Google настройте социальные сети в Личном кабинете.
- Для WeChat и QQ обратитесь к аккаунт-менеджеру проекта.
- Настройте ассет для вашего проекта Unity.
- Реализуйте логику аутентификации на стороне приложения.
Создание сборки проекта Unity под Android
- Перейдите к вашему проекту Unity.
- В главном меню выберите пункт
File > Build settings . - В панели
Platform выберите пунктAndroid . - Нажмите
Build .
Для дальнейшей настройки нативной авторизации вам понадобятся:
- Название пакета, которое можно найти в поле
Package Name в панелиInspector после выбора платформыAndroid вFile > Build settings . - Имя класса Android — название главной Activity с указанием неймспейса приложения (например,
com.domain.appname.activity
). Имя класса можно найти вAndroidManifest.xml
. Тег главной Activity должен содержать тегintent-filter
с действиемandroid.intent.action.MAIN
и категориейandroid.intent.category.LAUNCHER
. - Хеш-ключ Android. Вы можете получить его с помощью OpenSSL.
Настройка страницы приложения в личном кабинете разработчика Facebook
- Перейдите к настройкам приложения в личном кабинете разработчика Facebook.
- Перейдите Настройки > Основное.
- Нажмите Добавить платформу и выберите Android.
- В поле Название пакета Google Play укажите название пакета из вашего проекта Unity.
- В поле Название класса укажите имя класса Android из вашего проекта Unity.
- В поле Ключевые хеш-адреса укажите хеш-ключ Android из вашего проекта Unity.
- Нажмите Сохранить изменения.
Для дальнейшей настройки нативной авторизации вам понадобятся Идентификатор приложения и Секрет приложения, которые можно найти в настройках приложения в разделе Настройки > Основное.
Настройка проекта в Google API Console
- Перейдите в Google API Console.
- Нажмите Создать проект.
- Укажите Название проекта и Местоположение, нажмите Создать.
- Перейдите в созданный проект и в боковом меню нажмите Окно запроса доступа OAuth.
- Установите флажок Внешнее и нажмите Создать.
- Укажите необходимые параметры и нажмите Сохранить.
- В боковом меню выберите Учетные данные.
- Создайте клиент OAuth 2.0 для вашего приложения на Unity:
- Нажмите Создать учетные данные и выберите Идентификатор проекта OAuth.
- В поле Тип приложения укажите Android.
- Укажите Имя.
- В поле Название пакета укажите имя пакета из вашего проекта Unity.
- В поле Контрольная сумма сертификата SHA-1 укажите хеш-ключ Android из вашего проекта Unity.
- Нажмите Создать.
- Нажмите OK.
- Создайте клиент OAuth 2.0 для веб-приложения:
- Нажмите Создать учетные данные и выберите пункт Идентификатор проекта OAuth.
- В поле Тип приложения укажите Веб-приложение.
- Укажите Имя.
- Нажмите Добавить URI в разделе Разрешенные URI перенаправления и укажите URI
https://login.xsolla.com/api/social/oauth2/callback
. - Нажмите Создать.
- Нажмите OK.
Для дальнейшей настройки нативной авторизации вам понадобятся Идентификатор клиента и Секретный код клиента, которые можно найти в настройках идентификатора клиента для веб-приложения.
Настройка социальных сетей для варианта авторизации в Личном кабинете Xsolla
- Откройте ваш проект в Личном кабинете.
- В боковом меню выберите пункт Авторизация.
- Нажмите Настроить в панели нужного варианта авторизации.
- На странице навигации перейдите к блоку Аутентификация и выберите раздел Авторизация через социальные сети.
- Чтобы подключить социальную сеть, в карточке социальной сети нажмите значок ⚙ справа от названия и выберите пункт Подключить.
Настройка ассета для проекта Unity
- Перейдите к вашему проекту Unity.
- В главном меню выберите пункт
Window > Xsolla > Edit Settings . - Укажите идентификатор приложения:
- В поле
Facebook App ID укажите Идентификатор приложения из личного кабинета разработчика Facebook. - В поле
Google server ID укажите Идентификатор клиента из Google API Console для веб-приложения. - В поле
WeChat App ID укажите AppID из настроек приложения WeChat. - В поле
QQ App ID укажите AppID из настроек приложения QQ.
- В поле
Интеграция на стороне приложения
Реализуйте следующую логику при нажатии кнопки аутентификации через социальную сеть:
- Для Android-приложения создайте экземпляр класса
AndroidSDKSocialAuthHelper
и вызовите методPerformSocialAuth
. Пример реализации приведен в демопроекте в скриптеAssets/Xsolla.Demo/Login/Scripts/Login/Auth/AndroidSocialAuth.cs
.
- Для iOS-приложения создайте экземпляр класса
IosSDKSocialAuthHelper
и вызовите методPerformSocialAuth
. Пример реализации приведен в демопроекте в скриптеAssets/Xsolla.Demo/Login/Scripts/Login/Auth/IosSocialAuth.cs
.
Полезные ссылки
Нашли опечатку или ошибку в тексте? Выделите ее и нажмите Ctrl+Enter.