Подключить аутентификацию через Яндекс ID

Вы можете реализовать в своем проекте VibeCraft аутентификацию пользователей через Яндекс ID — единый аккаунт на Яндексе. Пользователи смогут входить в приложение с существующим аккаунтом, не создавая отдельный логин и пароль.

С разрешения пользователя приложение может получать данные его аккаунта, например имя, адрес электронной почты или аватар. Эти данные можно использовать для личного кабинета и персонализации приложения. VibeCraft поможет настроить коннектор Яндекс ID и добавит аутентификацию в код проекта.

Важно

Подключить аутентификацию через Яндекс ID можно только к проекту с собственным доменом. Привязка собственного домена доступна только с платной подпиской.

Чтобы подключить аутентификацию через Яндекс ID:

  1. Привяжите собственный домен, если еще не сделали этого.
  2. Запустите настройку коннектора.
  3. Создайте приложение в Яндекс OAuth.
  4. Завершите подключение в VibeCraft.
  5. Проверьте вход в приложение.

Запустите настройку коннектора

  1. Откройте главную страницу VibeCraft и выберите проект с привязанным собственным доменом.

  2. В правом верхнем углу нажмите Настройки.

  3. Откройте раздел Коннекторы и в карточке Яндекс ID нажмите Подключить.

    Совет

    Вы также можете запустить настройку прямо из чата. Для этого отправьте запрос:

    Подключи коннектор yandex-id и реализуй его в приложении.
    
  4. В чате появится запрос на подключение коннектора. Дождитесь, пока откроется окно Подключение Яндекс ID.

  5. В открывшемся окне:

    • В поле Название укажите название приложения.

    • В блоке Иконка нажмите Загрузить и выберите изображение на компьютере или нажмите Сгенерировать, чтобы создать его с помощью VibeCraft.

      Поддерживаются форматы JPG, PNG, GIF, WebP, SVG и ICO. Максимальный размер файла — 1 МБ, рекомендуемый размер изображения — 256 × 256 пикселей.

  6. Нажмите Продолжить.

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

  1. Авторизуйтесь в сервисе Яндекс OAuth через ваш аккаунт на Яндексе, с помощью которого вы планируете продолжать разработку.

  2. Откройте форму регистрации приложения.

  3. Укажите название приложения, загрузите иконку и заполните контактную почту. Нажмите Продолжить.

  4. На шаге Платформы приложений выберите Веб-сервисы.

  5. Вернитесь во вкладку VibeCraft и нажмите Продолжить.

    VibeCraft покажет адреса, которые нужно указать в Яндекс OAuth:

    • Redirect URLs — адреса возврата в приложение после авторизации.
    • Suggested Hostnames — адреса страниц, на которых будет размещена кнопка входа.

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

  6. Скопируйте все адреса из блока Redirect URLs в поля Redirect URI в Яндекс OAuth. Для каждого следующего адреса добавляйте поле с помощью кнопки .

  7. Аналогично перенесите все адреса из блока Suggested Hostnames в поля Suggest Hostname в Яндекс OAuth.

  8. В Яндекс OAuth нажмите Продолжить.

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

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

    Откроется страница созданного приложения с параметрами ClientID и Client secret.

Подробнее о регистрации приложения — в документации Яндекс ID.

Завершите подключение в VibeCraft

  1. Вернитесь во вкладку VibeCraft и нажмите Продолжить.

  2. Перенесите данные со страницы приложения из Яндекс OAuth:

    • ClientID.
    • Client secret.
  3. Нажмите Подключить и дождитесь завершения настройки.

  4. Нажмите Открыть настройки коннекторов. В разделе Коннекторы у коннектора Яндекс ID должен появиться статус Подключён. Дождитесь завершения обновления окружения приложения.

  5. Закройте настройки и дождитесь сообщения VibeCraft в чате о завершении работы: после подключения коннектора сервис добавит аутентификацию в код приложения.

Чтобы позже проверить подключение, в правом верхнем углу проекта нажмите Настройки и откройте раздел Коннекторы.

Проверьте вход в приложение

  1. Откройте вкладку Превью и при необходимости обновите предварительную версию кнопкой .
  2. Откройте приложение в новой вкладке браузера с помощью кнопки .
  3. Нажмите добавленную в приложение кнопку входа через Яндекс ID.
  4. Выберите аккаунт на Яндексе и разрешите доступ к данным, которые вы указали при регистрации приложения.
  5. Убедитесь, что после авторизации вы вернулись в приложение и вошли в аккаунт.

Если вход работает некорректно, проверьте адреса Redirect URI и Suggest Hostname в Яндекс OAuth и опишите проблему в чате VibeCraft.

После проверки опубликуйте обновленную версию проекта.

Полезные ссылки