“Вход через соцсет蔶

Описание¶

Модуль «Вход через соцсети» позволяет покупателям авторизоваться в вашем интернет-магазине с помощью:

• Яндекс
• Вконтакте
• Одноклассники
• Mail.ru
• Google
• Facebook
• X
• OpenID
• и других сервисов и социальных сетей.

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

Настройка модуля¶

1. Установите модуль «Вход через соцсети» в панели администратора, а также “Вход через соцсети: российские социальные сети”, чтобы подключить российские социальные сети.

   

2. Откройте настройки модуля «Вход через соцсети», кликнув по названию.

   Доступные настройки:

   Иконки	Выберите размер иконок социальных сетей. Доступные размеры: 24х24px 32х32px 64х64px Примечание Вы можете изменить или создать свои иконки, в том числе собственного размера. Иконки расположены в папке: /design/themes/[название_темы]/media/images/addons/hybrid_auth/icons/ Просто создайте свою папку или измените существующую. Иконки будут автоматически доступны.
   Автогенерация электронной почты	Некоторые социальные сети и сервисы не предоставляют email покупателя. В данной ситуации возможно два варианта: Покупателю будет предложено ввести адрес электронной почты, перед авторизацией. Покупатель будет сразу авторизован, email будет сгенерирован автоматически

3. Создайте необходимых провайдеров на специальной странице Настройки → Вход через соцсети.

4. Создайте нового провайдера (сервис) с помощью кнопки + Добавить соц. сеть.

   

5. Нажмите на название сервиса, чтобы выполнить настройку.

   

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

Yandex¶

1. Авторизуйтесь на сайте Яндекс.

2. Пройдите на страницу API OAuth-авторизация.

   

3. Создайте новое приложение на OAuth-сервере Яндекса.

   

4. Выполните настройку нового приложения:

   Шаг 1. Создание приложения

   • Название вашего сервиса — это название будет отображаться в окне авторизации пользователя на вашем сайте.
   • Иконка сервиса (не более 1Мб) — Выбирите изображение на ваше усмотрение (необязательное поле).
   • Для каких платформ нужно приложение:
     • Веб-сервисы (для регистрации вашего сайта на CS-Cart выберите этот вариант)
     • iOS-приложение
     • Android-приложение

   Сохранить и продолжить

   Шаг 2. Доступ к данным

   Выберите данные, доступ к которым вам нужен — здесь вы можете указать, какие данные аккаунта Яндекс будут переданы на ваш сайт.

   

   Сохранить и продолжить

   Шаг 3. Платформы приложения

   Для настройки веб-сервисов, заполните следующие данные:

   • Redirect URI — Адрес страницы, куда Яндекс направит пользователя после того, как он разрешил или отказал приложению в доступе. В данной строке нужно указать полный адрес вашего сайта. Например, в стандартной установке CS-Cart полный адрес домешней страницы будет включать /index.php. То есть адрес должен иметь примерно такой вид: https://teststore.ru/index.php.
   • Suggest Hostname — Хост страницы, на которой разместится кнопка или виджет авторизации (необязательное поле)
   

   Сохранить и продолжить

   Шаг 4. Почта для связи

   Укажите вашу почту, по которой Яндекс сможет связываться с вами.

   Сохранить и продолжить

5. Будет создано приложение и вам будут доступные данные:

   • ClientID

   • Client secret

     

6. Пройдите в панель администратора и добавьте нового провайдера «Yandex». Используйте данные созданного приложения.

   

Всё!

Созданные вами приложения доступны на специальной странице.

Google¶

1. Создайте проект в Google API Console.

2. Перейдите на страницу Учётные данные и создайте Идентификатор клиента OAuth для веб-приложения.

   Важно

   На этом шаге скопируйте ссылку из настроек провайдера Google на стороне CS-Cart и вставьте её как Разрешённый URI перенаправления на стороне Google.

   

3. После создания учётных данных вы увидите Идентификатор клиента и Секрет клиента. Скопируйте их в настройки провайдера Google на стороне CS-Cart и сохраните изменения. После этого покупатели смогут зарегистрироваться и войти в магазин через свои учётные записи Gmail.

ВКонтакте¶

Создайте новое приложение Вконтакте.

1. Откройте сайт Вконтакте для разработчиков. На главной странице нажмите Создать приложение или перейдите на вкладку Приложения и нажмите кнопку Создать.

   

2. В меню слева выберите пункт Подключение VK ID и нажмите кнопку Перейти в сервис.

3. Нажмите кнопку Добавить приложения.

4. Пройдите все шаги настройки приложения.

   Примечание

   На странице шага 2, нужно будет указать Базовый домен и Доверенный Redirect URL, это нужно для исправной работы VK. Базовый домен — это домен вашего сайта, например, store.ru. Если вы хотите использовать поддомен, то перед базовым доменом нужно поставить точку ”.”, например, .store.ru. Доверенный Redirect URL — тот адрес, куда будут перенаправлены ваши пользователи после успешной авторизации. Здесь нужно указывать полный адрес страницы, например, адрес домашней страницы CS-Cart включает /index.php (например, https://test-store.ru/index.php).

   

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

   

6. На странице настройки приложения вы найдете данные, которые нужно будет использовать в панели администратора CS-Cart:

   • ID приложения
   • Защищённый ключ
   

7. В панели администратора CS-Cart перейдите на страницу Настройки → Вход через соц.сети. Добавьте провайдера и выберите ему сервис Vkontakte.

   

Успех!

Facebook¶

1. Зарегистрируйтесь на портале Facebook for Developers.

2. Зайдите в раздел Мои приложения и добавьте новое приложение. Используйте для приложения такое же название, как у вашего магазина — покупатели увидят название приложения, когда попытаются войти в учётную запись в магазине через Facebook. Поэтому название магазина там будет смотреться естественно.

3. Найдите и добавьте в своё прилжение продукт Вход через Facebook. Предложение его настроить может появиться при создании приложения или на главной панели; ещё вы можете воспользоваться для этого разделом Продукты.

4. Откройте настройки продукта Вход через Facebook. Там нужно будет заполнить значение настройки Действительные URI перенаправления для OAuth — скопируйте это значение из настроек провайдера Facebook в панели администратора CS-Cart, а затем сохраните свои изменения на стороне Facebook.

5. Перейдите в основные настройки вашего приложения на Facebook. Скопируйте Идентификатор приложения и Секрет приложения и вставьте их в соответствующие поля провайдера Facebook в CS-Cart. Сохраните свои изменения на стороне CS-Cart.

   Важно

   На этом этапе в магазин уже можно войти через вашу учётную запись Facebook. Но приложение всё ещё в разработке, поэтому покупатели пока ещё не могут войти в учётные записи через Facebook.

6. Чтобы покупатели могли войти через Facebook, переведите его в рабочий режим на стороне Facebook. Для этого от вас могут потребоваться дополнительные действия (например, добавить ссылку на политику конфиденциальности).

   

X¶

1. Пройдите на страницу: https://apps.twitter.com/

2. Нажмите «Create New Apps».

   

3. Выполните первоначальную настройку приложения:

   Name	Название
   Description	Описание
   Website	URL
   Callback URL	http://ваш_домен/index.php?dispatch=auth.process&hauth_done=Twitter
   Yes, I agree	Соглашаемся с условиями.

   

4. Вам будет создано приложение. Переходите в раздел «API Keys», где будут доступны:

   • API key — ID
   • API secret — Секретный ключ
   

5. Создайте нового провайдера для сервиса «Twitter» в панели администратора.

   

Готово!

Одноклассники¶

1. Зарегистрируйтесь на портале Одноклассники и привяжите к своему аккаунту email – на этот email будут приходить письма, содержащие регистрационные данные приложений.
2. Получите права разработчика по этой ссылке.
3. После получения прав разработчика откройте раздел Игры, в верхнем меню выберите “В разработке”. В разделе моих загруженных игр нажмите на “Добавить приложение”.

3. Заполните необходимые настройки для нового приложения, и установите платформу OAuth. В настройке вам может помочь инструкция по созданию приложения от сервиса.

   Важно

   Во время тестирования авторизции на вашем сайте может возникнуть ошибка Указанный redirect_uri не зарегистрирован в настройках приложения. Чтобы решить данную проблему попробуйте ввести предложенный redirect_uri в поле Список разрешённых redirect_uri в настройках приложения и повторить попытку.

   

3. После создания приложения, вы получите API-ключи на вашу электронную почту.

   

4. Создайте нового провайдера используя полученные ключи.

   

Mail.ru¶

1. Пройдите в сервис «Сайты» от api.mail.ru: http://api.mail.ru/sites/

   

2. Нажмите «Подключить сайт» и соглашайтесь с условиями.

3. Заполните настройки на втором шаге регистрации:

   • Название
   • Адрес главной страницы
   

4. Во избежание возможных ошибок, скачайте и разместите файл receiver.html в файловом менеджере в основной папке вашего интернет-магазина или маркетплейса, как это предложено mail.ru. Нажмите Пропустить.

   

5. Сайт будет добавлен, и вы получите все необходимые ключи:

   • ID
   • Приватный ключ
   • Секретный ключ (его нужно использовать для настройки провайдера в панели администратора)
   

6. Пройдите в панель администратора и создайте нового провайдера с помощью модуля «Social Login».

   

Финиш!