Skip to content

VKCOM/vkid-web-sdk

Repository files navigation

npm npm bundle size

VK ID SDK — это библиотека для безопасной и удобной авторизации пользователей в вашем сервисе через VK ID.


ℹ️ Версия VK ID SDK 2.0.0-alpha поддерживает авторизацию по протоколу OAuth 2.1, а также способы входа через аккаунты Одноклассников и Mail.ru. Если вы хотите участвовать в тестировании этой версии SDK или узнать о ней подробнее, напишите нам на почту [email protected].

Текущая стабильная версия VK ID SDK - 1.1.0.


VK ID SDK сейчас находится в бета-тестировании. О проблемах вы можете сообщить с помощью issues репозитория.


Установка

NPM:

npm i @vkid/sdk

YARN:

yarn add @vkid/sdk

PNPM:

pnpm add @vkid/sdk

CDN:

<script src="https://unpkg.com/@vkid/[email protected]/dist-sdk/umd/index.js"></script>

Обратите внимание: Для работы авторизации нужен APP_ID. Вы получите его, когда создадите приложение в кабинете подключения VK ID.

Пример

Базовая авторизация
import * as VKID from '@vkid/sdk';

VKID.Config.init({
  app: APP_ID,
  redirectUrl: 'https://example.com',
  state: 'state',
  codeVerifier: 'codeVerifier',
  scope: 'phone email',
});


const authButton = document.createElement('button');
authButton.onclick = () => {
  // После авторизации будет редирект на адрес, указанный в параметре redirectUrl
  VKID.Auth.login()
    .catch(console.error);
};

document.getElementById('container').appendChild(authButton);
OneTap
import * as VKID from '@vkid/sdk';

VKID.Config.init({
  app: APP_ID,
  redirectUrl: 'https://example.com',
  state: 'state',
  codeVerifier: 'codeVerifier',
  scope: 'phone email',
});

const oneTap = new VKID.OneTap();

const container = document.getElementById('VkIdSdkOneTap');

if (container) {
  oneTap
    .render({ container })
    .on(VKID.WidgetEvents.ERROR, console.error);
}

Документация

Contributing

Проект VK ID SDK имеет открытый исходный код на GitHub, и вы можете присоединиться к его доработке — мы будем благодарны за внесение улучшений и исправление возможных ошибок.

Code of Conduct

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

Contributing Guide

В руководстве вы можете подробно ознакомиться с процессом разработки и узнать, как предлагать улучшения и исправления, а ещё — как добавлять и тестировать свои изменения в VK ID SDK. Также рекомендуем ознакомиться с общими правилами оформления кода в проекте.