В этом уроке мы закончим вводную серию уроков по работе с api ВКонтакте. Разберем необходимость и процедуру получения access token.
При запросах к api ВКонтакте некоторые методы возвращают только общедоступные данные. Например, метод users.get возвращает только first_name, last_name и id. Чтобы получить остальные поля, указанные в методе, необходимо в запросе передать параметр access token. Способ его получения описан на этой странице
Код урока
API Вконтакте
API Вконтакте
of your page —> VK.init(); VK.Widgets.Comments(«vk_comments», ); $.ajax(< url: ‘https://api.vk.com/method/widgets.getComments?widget_api_id=6148618) .done(function(data) < console.log(data.response.posts[0].text); >); $.ajax(< url: ‘https://api.vk.com/method/users.get?user_ids=kamabzalovv=5.67) .done(function(data) < console.log(data); >);
Источник: kamil-abzalov.ru
VK API #1 Receiving access token (standalone app)
Авторизация на сайте при помощи Вконтакте
Не пропусти свежие посты, подпишись:
- Посетитель сайта наживает кнопку «Войти через соц.сеть Вконтакте», на сайте открывается специальная страница запрашивающая доступ к определённым данным пользователя (например личные данные и список контактов)
- После подтверждения, пользователь будет перенаправлен на специальную страницу сайта, куда Вконтакте передаст код авторизации
- Далее сайт выполнит запрос с этим кодом и ключом доступа полученным от vk ранее при регистрации сайта в API, в случае успеха Вконтакте вернёт сайту специальный ключ access_token, которым сайт будет пользоваться для получения параметров пользователя VK и последующей авторизации его на сайте. Обычно происходит сверка email адреса в VK и далее поиск и авторизация пользователя на сайте по полученному от vk email-адресу.
Регистрация приложения
В первую очередь создайте приложение на странице https://vk.com/editapp?act=create . В свойстве «Платформа» нужно выбрать флажок «Сайт», а так же указать полный адрес сайта и базовый домен.
Далее нужно заполнить форму описания приложения. Здесь обязательно нужно указать ссылки на страницы с пользовательским соглашением и политикой конфиденциальности вашего сайта.
Теперь перейдите в раздел «Настройки», здесь вам будут доступны такие параметры как «ID приложения», а так же «защищённый ключ» и «сервисный ключ доступа» которые потребуются нам при написании скрипта авторизации. Так же обязательно укажите «Доверительный Redirect URI» (отдельная страница на вашем сайте, это необходимо для сохранности данных пользователя и защиты от злоумышленников).
Готово, можно приступать к написанию скрипта.
Настройка ссылки для входа
Первым делом сформируем ссылку используя которую пользователь нашего сайта сможет дать необходимые разрешения, на запрошенные нашим сайтом действия, например доступ к контактам.
При переходе по ссылке, вы попадёте на страницу запроса разрешения.
После того как пользователь дал согласие, его перенаправит на страницу указанную в параметре redirect_uri, в моём случае это такой URL:
https://it-svalka.ru/verify/?code=71706d4fb3edf76692 $params = [ ‘client_id’ =>’ID приложения’, ‘client_secret’ => ‘Защищённый ключ приложения’, ‘redirect_uri’ => ‘https://it-svalka.ru/verify/’, ‘code’ => $_GET[‘code’] //Код полученный от VK ]; //Запрашиваем токен доступа access_token $data = file_get_contents(‘https://oauth.vk.com/access_token?’ . urldecode(http_build_query($params))); $data = json_decode($data, true); if (!empty($data[‘access_token’])) < if($data[’email’])< //Выполняем авторизацию пользователя по email >> >
В рамках 1С Битрикс, организовать авторизацию по email можно так:
if (!empty(trim($_GET[‘code’]))) < $params = [ ‘client_id’ =>’ID приложения’, ‘client_secret’ => ‘Защищённый ключ’, ‘redirect_uri’ => ‘https://it-svalka.ru/verify/’, ‘code’ => $_GET[‘code’] //Код полученный от VK ]; //Запрашиваем токен доступа access_token $data = file_get_contents(‘https://oauth.vk.com/access_token?’ . urldecode(http_build_query($params))); $data = json_decode($data, true); if (!empty($data[‘access_token’])) < if($data[’email’])< //Выполняем арторизацию пользователя по email $userByEmail = BitrixMainUserTable::getList([ ‘select’ =>[‘ID’], ‘filter’ => [‘EMAIL’=>$data[’email’]] ])->fetch(); if($userByEmail[‘ID’])< $USER->Authorize($userByEmail[‘ID’]); LocalRedirect(‘/auth/’); //Редирект на страницу авторизации, для лучшего эффекта > else < echo ‘Пользователя с emial ‘ . $data[’email’] . ‘ на сайте не зарегистрировано
‘; > > > >
Конечно в 1С Битрикс предусмотрен модуль социальных сетей позволяющий организовать подобную авторизацию без написания кода. Данный пример следует воспринимать как учебный. Однако вы так же можете реализовать упрощённую регистрацию пользователей запросив данные о контактах, чтобы сразу найти уже зарегистрированных «друзей» на вашем сайте и т.д. Сценарии могут быть любыми.
Не пропусти свежие посты, подпишись:
Источник: it-svalka.ru
Single Sign-On с поставщиком VK
В этой статье рассмотрим Single Sign-On (SSO) с помощью поставщика VKontakte (но также тут есть вход с помощью GitHub и Google). Приложение представляет собой Spring Boot OAuth 2 клиент c Ajax-запросами на JQuery.
В отличие от Google и Github, которые настроены в Spring заранее, VK не входит пакет. Кроме того, запросы и ответы VK, участвующие в OAuth 2 немного отличаются от стандартных, поэтому потребуется прописать пару пользовательских бинов.
Что в VK отличается от стандарта по умолчанию
Сlient Сredentials передаются в теле запроса
VK требует, чтобы в запросе Access-токена Сlient Сredentials передавались не в Basic Auth в заголовке Authorization (как у большинства провайдеров), а в теле запроса. Но перенести Сlient Сredentials в тело запроса просто — настройкой в application.properties:
spring.security.oauth2.client.registration.vk.client-authentication-method=post
То есть поведение по умолчанию было таким:
А будет другим — Client Credentials уйдут в тело запроса.
В ответе отсутствует token_type: Bearer
Запрос изменили, но с ответом тоже не все ладно. В ответном JSON отсутствует пункт «token_type»:»Bearer»:
А Spring ожидает, что token_type должен быть непустым и выбрасывает исключение. Поэтому ниже мы модифицируем ответ с помощью CustomTokenResponseConverter.
После успешного получения Access Token-а по протоколу OpenID идет обращение за данными авторизовавшегося пользователя. Это конечная точка Userinfo провайдера. Тут ответ тоже нестандартный.
VK возвращает по адресу Userinfo ответ в обертке
Обычно в ответе сразу перечисляются атрибуты пользователя, но не в VK. Здесь ответ приходит обернутым в response и еще в массив:
Мы исправим это с помощью пользовательского DefaultOAuth2UserService.
Maven-зависимости
Наше приложение представляет из себя OAuth 2 клиент:
org.springframework.security spring-security-oauth2-client
Кроме того, понадобится:
org.springframework.security spring-security-oauth2-jose
Контроллер
Пусть будет контроллер, который по /user выдает имя аутентифицированного пользователя, а по /secret — данные, доступные только аутентифицированному пользователю:
Причем /user запрашивается с помощью JavaScript с главной страницы (см. в коде index.html).
WebConfig
Настроим доступ к страницам. Главная страница и статика доступны, остальные url — только для аутентифицированных пользователей. Причем аутентификация осуществляется с помощью OpenID, на это указывает строка .oauth2Login().
На ней и можно было бы поставить точку (точнее, точку с запятой), если бы в логине мог участвовать только GitHub и Google. Но из-за VK мы прописываем пользовательский OAuth2AccessTokenResponseClient для добавления Bearer Token и СustomOAuth2UserService для преобразования ответа с конечной точки Userinfo.
Вышеуказанные пользовательские классы рассмотрим чуть ниже, а пока настройки GitHub, Google и VK в файле application.yml.
Настройки GitHub, Google и VK в файле application.yml
Здесь client-id и client-secret нужно получить у соответствующего провайдера. Для этого нужно зарегистрировать у провайдера приложение и вставить сюда сгенерированные коды. В VK приложения создаются тут.
spring: thymeleaf: cache: false security: oauth2: client: registration: github: client-id: your-client-id client-secret: your-secret google: client-id: your-client-id client-secret: your-secret vk: client-id: your-client-id client-secret: your-secret redirect-uri: «/login/oauth2/code/» #use post, as vk needs clientId and clientSecret as request params and does not accepts Basic auth client-authentication-method: post authorization-grant-type: authorization_code scope: email provider: vk: #revoke=1 needs to always show vk dialog authorization-uri: https://oauth.vk.com/authorize?revoke=1 token-uri: https://oauth.vk.com/access_token user-info-uri: https://api.vk.com/method/users.get?v=5.52 «login»: «myluckagain», «id»: 28870472, «node_id»: «MDQ6VXNlcjI4ODcwNDcy», «avatar_url»: «https://avatars.githubusercontent.com/u/28870472?v=4», «gravatar_id»: «», «url»: «https://api.github.com/users/myluckagain», «html_url»: «https://github.com/myluckagain», . «repos_url»: «https://api.github.com/users/myluckagain/repos», «events_url»: «https://api.github.com/users/myluckagain/events», «received_events_url»: «https://api.github.com/users/myluckagain/received_events», «type»: «User», «site_admin»: false, «name»: «sys», «company»: null, . >
У каждого поставщика свой набор атрибутов, настройка user-name-attribute отвечает за то, какой атрибут будет именем OAuth2User, как было сказано выше.
VK Userinfo response:
Итак, для модификации ответа напишем свой CustomOAuth2UserService.
Вообще можно и не писать CustomOAuth2UserService, а вместо этого в качестве значения user-name-attribute прописать единственный доступный атрибут response. Но тогда результат principal.getName() будет странным — весь JSON, находящийся внутри response.
Метод loadUser() собственно и возвращает ответ — в виде OAuth2User.
Выглядит пользовательский класс страшно, но на самом деле это всего лишь копия DefaultOAuth2UserService с блоком if в начале метода:
- если провайдер не VK, то делегируем работу родителю super.loadUser(userRequest), чтобы все шло как обычно;
- если провайдер VK, то делаем то же самое, а в конце извлекаем атрибуты из обертки «response» и из массива.
Теперь VK работает, как и остальные провайдеры.
Защищенная страница тоже открывается для аутентифицированного пользователя:
Итоги
Мы настроили SSO с провайдером VK. Исходный код примера есть на GitHub.
Источник: sysout.ru