Настройка кнопок авторизации вКонтакте с VK ID

В этой статье рассмотрим новый метод создания кнопки авторизации через соц. сеть вКонтакте используя VK ID.

Заметка

Данный функционал доступен с версии магазина 13.0.3. Пожалуйста, обновите ваш магазин до актуальной версии, чтобы иметь доступ к этому функционалу.

• Настройка на стороне вКонтакте
• Настройка на стороне Адвантшоп

Настройка на стороне вКонтакте

Перед началом настройки кнопки авторизации, необходимо создать приложение на стороне вКонтакте. Для этого необходимо перейти на сайт Сервис авторизации ID VK, авторизоваться и создать приложение. Перейдите на вкладку "Приложение" (рис. 1).

Рисунок 1.

После создания приложения в разделе "Подключение авторизации" (рис. 2) укажите "Базовый домен" и "Доверенный Redirect URL". 

Рисунок 2.

Для "Базового домена" укажите адрес вашего магазина, например, shop.ru. Для "Доверенного Redirect URL" укажите адрес вашего магазина + /auth/vkid, например https://shop.ru/auth/vkid.

Далее открываем вкладку "Авторизация" и выбираем "Почта - Опционально" в разделе "Данные для регистрации" (рис. 3).

Рисунок 3.

Также можно перейти на вкладку "Доступы" и в разделе "Расширенные доступы" включить "Номер телефона" (рис. 4). Этот этап не является обязательным, но рекомендуется.

Рисунок 4.

Теперь перейдем к настройке на стороне вашего магазина.

Настройка на стороне Адвантшоп

Чтобы подключить новый метод авторизации с VK ID, перейдите в панель администрирования в раздел "Настройки - Системные настройки" (рис. 5).

Рисунок 5.

Выберите вкладку "Регистрация и авторизация" и найдите раздел VK ID (рис. 6).

Рисунок 6.

Укажите ID вашего приложения, который вы можете получить на вкладке "Приложение" на сайте VK и после этого включите этот метод авторизации, поставив галочку рядом с "Включен".

Важно

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

Чтобы повторно переподключить канал продаж вКонтакте, перейдите в админ панели в этот канал продаж, затем перейдите на вкладку "Настройки" и нажмите на ссылку "Удалить привязку" (рис. 7).

Рисунок 7.

После этого укажите новый ID приложения, который вы получили ранее, на этапе его создания следуя этой инструкции.

Готово, мы рассмотрели, как подключить новый метод авторизации с использованием кнопки VK ID.