как создать приложение для авторизации через вк

Как сделать авторизацию с помощью ВКонтакте в десктопном приложении

Авторизуйтесь

Как сделать авторизацию с помощью ВКонтакте в десктопном приложении

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

Как происходит авторизация?

Авторизация ВКонтакте ничем не отличается от любой другой авторизации через сторонний сервер. Этот процесс отлично описал пользователь StackOverflow qnub:

Шаг первый. Зарегистрировать своё приложение и получить ключ

Этот шаг самый простой. Нужно перейти на страницу ВК для разработчиков: https://vk.com/dev — и нажать на кнопку «Создать приложение». Тип указываем как «Standalone-приложение», имя, естественно, указываем произвольное. После этого в разделе «Мои приложения» появится (что бы вы думали?) ваше приложение. Смело нажимайте «редактировать», затем переходите в раздел «Настройки» — там первой же строкой вы увидите надпись «ID приложения: 1234567». Эти цифры — всё, что вам нужно запомнить для авторизации.

Заметьте, что нет никакого смысла скрывать ID приложения — он публично показывается, например, при отправке сообщения на стену через это приложение. Ни токены, ни любую другую информацию украсть, используя ID, нельзя. В общем-то, вы можете использовать даже ID моего приложения (если вам нужно написать небольшой скрипт для себя).

Шаг второй. Формирование специальной ссылки

Далее вам нужно направить пользователя по специально сформированному адресу (её упоминания выделены жирным цветом в первом разделе статьи), где он подтвердит, что хочет разрешить вашему приложению выполнять какие-то действия со своим аккаунтом. Как же формируется эта ссылка?

Пример ссылки, которая должна у вас получиться:

Шаг третий. Что дальше?

Дальше следует направить пользователя по сформированной ссылке. После того, как он проделает все необходимые для авторизации манипуляции, он будет перенаправлен на страницу, имеющую адрес

Нас интересует TOKEN. Как же направить пользователя на страницу из Java-приложения и как получить адрес страницы, на которую его перенаправит ВК (чтобы извлечь из неё токен)? Существует два способа.

Советский, через браузер по умолчанию

Если вы решили пойти по этому пути, то вы просто открываете браузер системы по умолчанию с полученной выше ссылкой, а пользователю каким-то образом сообщаете, что он должен скопировать из URL токен и вставить его в какое-то поле. Понятно, что у этого метода отвратительный UX, однако его можно реализовать легко и быстро. Вполне подойдёт, если вы пишете приложение для себя — чтобы скачать музыку или получать уведомления. Реализуется он следующим образом:

Буржуазный, через веб-компоненты

Если вы решили пойти по этому пути, то вам потребуется использовать какую-либо стороннюю GUI-библиотеку (или по крайней мере JavaFX), у которой в арсенале есть свой компонент браузера. Над таким бразуером ваша программа будет иметь полную власть, и вы сможете извлечь адрес, на который вас перенаправил ВК, программными средствами. На JavaFX это можно реализовать следующим образом:

Источник

Добавляем возможность входа через ВКонтакте в iOS приложение

Вступление

Кому будет полезно?

Новичкам в iOS разработке, тем, кто хочет расширить возможности своего приложения, но не хочет использовать сторонние SDK, и, конечно, тем, кто просто увлекается этим делом.

Начнем

Для начала, можно прочитать небольшое «вступление» в официальной документации, а также зарегистрировать свое приложение как Standalone, получив все необходимые ключи.
Окей, для получения access_token (то без чего нам не жить) потребуется отправить запрос следующего вида:

Не буду повторять, что означают все эти параметры, они как минимум расписаны в приведенной выше странице, как максимум — интуитивно понятны по названию.

А теперь кодим!

Ура-ура, все этого ждали! Допустим, в вашем приложении есть некий ViewController, в котором имеется кнопочка «Зайти через ВКонтакте». Хорошо.

Получаем access_token

Добавим несколько методов в этот класс. Вкратце: после нажатия на кнопку показываем UIWebView, авторизуемся, получаем токены и радостно бежим делать остальные запросы.
Внимание! В проекте включен Automatic Reference Counting.

Собственно, здесь мы сделали все необходимые приготовления. Остановлюсь подробнее на самом главном — запросе.

client_id=APP_ID — вместо APP_ID подставляем то, что получим после регистрации приложения на сайте;
scope=wall,offline — попросим доступ на работу со стеной и на работу в оффлайне (чтоб токен долго не истекал);
redirect_uri=oauth.vk.com/blank.html — тут мы найдем запрашиваемый токен, главная задача — отследить перенаправление на эту страницу и тут же закрыть окно авторизации (страница совсем некрасивая и пользователю совсем не надо ее видеть);
display=touch — на iPhone смотрится как родная, все оптимизировано для работы с тач устройствами;
response_type=token — ну и, собственно, то что хотим получить.
Далее, нам надо отследить момент перехода на oauth.vk.com/blank.html. Что ж, вспоминаем, у UIWebView есть замечательный метод webViewDidFinishLoad, который вызывается после загрузки очередной страницы (не забудьте добавить его в хедер!).

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

Токены получили, что дальше?

Дальше создадим синглтон для работы с API (возможности, конечно же, можно расширить, тут они невелики)
Хедер:

А вот так все должен был выглядеть момент парсинга ответа сервера:

Запрос на информацию о пользователе элементарен (документация):

Не буду его разъяснять, рассмотрим запрос посложнее. Вот и он:

Что же он из себя представляет?
uid=%@ — подставляем user_id;
message=%@ — нужное нам сообщение;
attachments=http://google.com — добавим ссылку на сайт;
access_token=%@ — подставляем, собственно, токен.
Подробнее тут.

Ну вот, поставленной цели мы добились. Стоило нам это недорого — сотни полторы строчек простого кода. Мы избежали поиска готовых SDK — нам это не требуется.
Если хочется большего — пожалуйста. Только не забывайте спрашивать разрешения у пользователя, если хотите сделать что-то помимо описанного.

На этом откланяюсь, надеюсь, начинающим будет полезно («аццким прогерам» — вряд ли). Жду ваших коментариев и замечаний. Спасибо, что прочли, как говорится, «пальцы вверх, подписывайтесь на наш канал!»

Источник

Как создать приложение для авторизации через вк

Небольшой how-to по созданию приложений в популярных соцсетях для авторизации пользователей.

На данный момент существует множество способов реализации авторизации посредством социальных сетей. Не секрет, что существуют прокси–сервисы, вроде loginza или ulogin, для упрощения разработки социальной авторизации, и вы можете их смело использовать в своих проектах, однако иногда возможность использовать провайдеров отсутствует и вы сталкиваетесь с API соцсетей лицом–к–лицу.

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

Вконтакте

Создать приложение ВК достаточно просто. Для создания нового приложения, нужно воспользоваться пунктом левого меню «Управление» (если по какой–то причине у вас этого нет — вот прямая ссылка https://vk.com/editapp?act=create):

ВК предоставляет три типа приложений «Standalone», «Веб–сайт» и «Встраиваемое приложение», подробнее о типах приложений можно прочитать в официальной документации, нам же для авторизации, нужно выбрать «Веб-сайт».

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

Далее, нужно перейти в раздел «Настройки», там вы увидите секцию с ключами, которые понадобятся в дальнейшем и настройки безопасности приложения:

Доверенный redirect URI, это пути, на которые ВКонтакте разрешено перенаправлять пользователя в процессе авторизации. URI передаётся сети в процессе авторизации с вашего сайта.

Эти пути зависят от используемой вами библиотеки, но как правило, URL авторизации и redirect URI — одни и те же (например, в модуле opencart 1.5 social login это сделано именно так).

Facebook

Facebook предоставляет достаточно удобный интерфейс для создания приложений. Для реализации приложения, Вам нужно перейти в раздел для разработчиков и создать новое приложение:

Система требует ввести ID приложения, это название. С названием не переусердствуйте — у Facebook есть ограничение на количество символов в названии приложения.

Приложение создано, теперь приступаем к настройке. Сперва нужно подключить к приложению возможность авторизации.

Для этого на странице «Добавить продукт«, выбираем «Вход через Facebook» и кликаем по кнопке «Настроить«:

Подобно ВКонтакте, потребуется указать тип вашего приложения. Для нас актуален пункт «Веб«:

После этих манипуляций, в левом меню, у вас появится новый продукт «Вход через Facebook«, выбираем пункт «настройки» и вписываем пути в поле «Действительные URL-адреса для перенаправления OAuth«.

Когда это сделано, переходим в настройки приложения:

В этом разделе вы можете получить всю необходимую информацию для доступа к API, а именно Идентификатор приложения и Секретный ключ приложения:

Twitter

Честно говоря, с API щебетальни, у меня ранее часто возникали непонятные проблемы, но сейчас, кажется, у них всё более менее стабилизировалось.

Для создания нового приложения переходим в раздел для разработчиков и кликаем по «Create New App«. Система потребует ввести основную информацию о приложении и подтвердить согласие с условиями предоставления сервисов.

После того, как вы это заполните — перед вами откроется страница настроек приложения:

Если вашему приложению требуется получать email пользователя, то переходим в раздел Permissions и ставим галочку «Request email addresses from users«. Также, тут можно выставить права для приложения — нам для авторизации достаточно прав на чтение «Read only«.

Далее, нам нужно получить авторизационные данные для вашего сайта. Для этого переходим в раздел «Keys and Access Tokens«.

Для приложений, взаимодействующих с API Twitter, как правило, требуется три элемента авторизации: Consumer key, consumer secret и AppID.

Первые два находятся прямо на этой странице, а вот AppID нужно скопировать из строки браузера (число, между app/ и /keys):

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

Регистрация приложения в ok.ru не отличается сложностью, но тут есть несколько нюансов.

Нюанс #1: стать разработчиком на ok.ru

Если вы в первый раз имеете дело с API одноклассников, то имейте в виду — сперва вам необходимо активировать режим разработчика. Делается это на странице https://ok.ru/devaccess.

После того, как вы получите права разработчика, вы сможете создать своё первое приложение.

Нюанс #2: где мои приложения?

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

Настройка приложения в одноклассниках в разы проще — вам всего лишь нужно указать список разрешённых redirect_url и выставить приложению нужные права. При создании приложения, все необходимые ключи и идентификаторы будут отправлены вам на почту.

И вот тут мы подходим к наиболее интересному нюансу API этой соцсети. Разработчики Одноклассников очень бережно относятся к своим пользователям, поэтому не дают доступ к email кому попало.

Нюанс #3: как получить права на чтение email

Для получения прав к чтению email адреса пользователя, нужно запросить эту пермиссию у тех.поддержки API одноклассников. В письме кратко поясните, в каких целях собираетесь использовать email и укажите ID ваших приложений.

Ответ, по моему опыту, приходит от 2 до 24 часов, поэтому если у вас несколько приложений, проще заранее создать их и запросить пермиссию одним письмом для всех сразу.

К слову, AppID приложения, аналогично Твиттеру, берётся из URL адресной строки браузера:

Instagram (бонус)

Вообще, авторизация на сайте через инстаграм, на мой взгляд, такое себе решение.

Во–первых, скорее всего, мало кто будет этим пользоваться, во–вторых социальные приложения в инсте очень жёстко регулируются и вывести своё приложение из sandbox режима бывает довольно проблематично, ну и в–третьих, API обители селфаков может банально оказаться несовместимым с ожиданиями вашего приложения.

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

На заметку

Вы не сможете получить email пользователя из instagram API. Если ваше приложение требует использование email, то придётся отказаться от авторизации через instagram!

Тем не менее, для создания нового приложения переходим в раздел для разработчиков и выбираем пункт «Manage Clients«:

На странице кликаем по «Register a New Client» и заполняем требуемые поля:

В поле Valid redirect URIs вбиваем через пробел список разрешённых к редиректу URL, указываем Company name, Contact Email и ссылку на Privacy Policy на вашем сайте. Заолнять поля сразу необязательно, но без этих данных, вы не сможете отправить приложение на модерацию.

Пока приложение находится в режиме песочницы (sandbox mode), у вас есть полный доступ ко всем API методам, но с одним ограничением — вы не сможете получать какую–либо персональную информацию. После того, как вы закончите разработку и отладку вашего приложения, вам будет необходимо отправить приложение на модерацию.

Отправка на модерацию производится в разделе «Permissions«, рекомендую перед этим очень внимательно ознакомиться с правилами создания запросов на модерацию в документации Instagram.

Источник

Вход на сайт через Вконтакте

Многие соцсети позволяют создавать приложения и через API получать данные пользователей, поэтому их использует для быстрой регистрации и авторизации на сайтах. Как проходит аутентификация, рассмотрим на примере VK:

Регистрация приложения

Для начала нужно создать приложение на странице https://vk.com/editapp?act=create

В меню «Платформа» нужно указать – сайт, заполнить поля «адрес сайта» и «основной домен».

В настройках видим ID приложения и защищённый ключ, также нужно убедится что приложение включено и видно всем.

Ссылка для входа

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

В redirect_uri указываем скрипт-обработчик, туда придет секретный код.

В параметре state можно передать URL текущей страницы, чтобы вернуть пользователя обратно.

При переходе по ссылке откроется страница:

Получение данных

redirect_uri должен быть такой же как в ссылке для входа.

Полученные данные пользователя

Далее все завит от реализации сайта, пользователя можно добавить в БД или обновить его данные и авторизовать в системе.

Источник

Авторизация на сайте с помощью ВК, простой и понятный способ на PHP!

В данной статье Вас ждет действительно рабочий,а самое главное понятный туториал, как сделать авторизацию с помощью ВК!

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

Если Вы заинтересованы в этом вопросе, как же все-таки сделать авторизацию используя ВК, то у Вас уже есть сайт, или как минимум вы обладаете базовыми знаниями. Для начала нам нужно создать приложение Вконтакте, самый простой шаг.

1. Переходим на сайт https://vk.com/apps?act=manage и создаем новое приложение:

2. Заполняем следующие данные:
Название: Любое, его видно только во время авторизации, например авторизовавшись на нашем сайте с помощью ВК, Вы видите это, без количества участников.
Платформа: Выбираем «Сайт»
Адрес сайта: Ссылка на ваш сайт
Базовый домен: Ссылка на ваш сайт

Отлично, нажимаем подключить сайт.

3. Переходим в настройки приложения, копируем ID приложения и Защищенный ключ, сохраняем куда-нибудь и на этом работа на стороне ВК окончена, переходим к написанию скрипта.

4. Теперь самое интересное, нам нужно написать скрипт (обработчик), давайте создадим на нашем сервере в корне сайта файл auth.php и приступим к его редактированию. Хочу отметить, что на локальном сервере (OpenServer) авторизация работать не будет!

Открываем файл, я использую для этого PHPStorm и давайте создадим несколько переменных с пояснениями:

Тут все понятно, подставляем параметры из нашего приложения, ссылку указывать полностью, где лежит сам скрипт.

Далее формируем ссылку, которая будет ввести на сайт ВК с передаваемыми параметрами:

Ссылка сформирована, теперь нужно получить и обработать ответ от ВК, после того как пользователь перешел по ссылке:

После того как пользователь перешел по ссылке и подтвердил передачу данных, Вам на сервер в GET запросе вернется code, используя его мы запрашиваем у ВК токен пользователя, отправляем запрос в ВК с параметрами указанные в массиве

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

Теперь следующим запросом мы получаем данные о пользователе, используя его токен и обращаясь к API VK https://api.vk.com/method/users.get мы получаем json от VK, который мы можем распарсить. Давайте попробуем авторизоваться, заходим на нашу страницу и нажимаем авторизация:

Разрешаем и у нас на сайте появляются данные об аккаунте:

Авторизация работает. Далее можете сохранить ID в сессию и проверять авторизован пользователь или нет. Давайте доработаем код:

В самый конец добавляем:
А ссылку заменяем на:

Авторизация через ВК готова! Скачать исходник можно ниже

Источник