Как авторизоваться в ВК

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

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

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

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

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

Платформа: Выбираем «Сайт»
Адрес сайта: Ссылка на ваш сайт
Базовый домен: Ссылка на ваш сайт

Двойная авторизация в вк!!!

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

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

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

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

$client_id = 7157110; // ID приложения $client_secret = ‘ESlBJHmVMbeh8IVLiBDv’; // Защищённый ключ $redirect_uri = ‘http://royera.ru/auth.php’; // Адрес сайта

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

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

$url = ‘http://oauth.vk.com/authorize’; // Ссылка для авторизации на стороне ВК $params = [ ‘client_id’ => $client_id, ‘redirect_uri’ => $redirect_uri, ‘response_type’ => ‘code’]; // Массив данных, который нужно передать для ВК содержит ИД приложения код, ссылку для редиректа и запрос code для дальнейшей авторизации токеном

Теперь можно открыть сайт скопировав $redirect_uri

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

ВК Live ошибка авторизации. Не работает. Что Делать

if (isset($_GET[‘code’])) < $result = true; $params = [ ‘client_id’ =>$client_id, ‘client_secret’ => $client_secret, ‘code’ => $_GET[‘code’], ‘redirect_uri’ => $redirect_uri ]; $token = json_decode(file_get_contents(‘https://oauth.vk.com/access_token’ . ‘?’ . urldecode(http_build_query($params))), true); if (isset($token[‘access_token’])) < $params = [ ‘uids’ =>$token[‘user_id’], ‘fields’ => ‘uid,first_name,last_name,screen_name,sex,bdate,photo_big’, ‘access_token’ => $token[‘access_token’], ‘v’ => ‘5.101’]; $userInfo = json_decode(file_get_contents(‘https://api.vk.com/method/users.get’ . ‘?’ . urldecode(http_build_query($params))), true); if (isset($userInfo[‘response’][0][‘id’])) < $userInfo = $userInfo[‘response’][0]; $result = true; >> if ($result) < echo «ID пользователя: » . $userInfo[‘id’] . ‘
‘; echo «Имя пользователя: » . $userInfo[‘first_name’] . ‘
‘; echo «Ссылка на профиль: » . $userInfo[‘screen_name’] . ‘
‘; echo «Пол: » . $userInfo[‘sex’] . ‘
‘; echo «День Рождения: » . $userInfo[‘bdate’] . ‘
‘; echo ‘

‘; echo «
«; > >

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

$params = [ ‘client_id’ => $client_id, ‘client_secret’ => $client_secret, ‘code’ => $_GET[‘code’], ‘redirect_uri’ => $redirect_uri ];

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

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

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

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

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

$_SESSION[‘id’] = $userInfo[‘id’];

А ссылку заменяем на:

$client_id, ‘redirect_uri’ => $redirect_uri, ‘response_type’ => ‘code’]; // Массив данных, который нужно передать для ВК содержит ИД приложения код, ссылку для редиректа и запрос code для дальнейшей авторизации токеном if(empty($_SESSION[‘id’])) < echo «Вы уже авторизованы»; >else < echo $link = ‘

Аутентификация через ВКонтакте

‘; > if (isset($_GET[‘code’])) < $result = true; $params = [ ‘client_id’ =>$client_id, ‘client_secret’ => $client_secret, ‘code’ => $_GET[‘code’], ‘redirect_uri’ => $redirect_uri ]; $token = json_decode(file_get_contents(‘https://oauth.vk.com/access_token’ . ‘?’ . urldecode(http_build_query($params))), true); if (isset($token[‘access_token’])) < $params = [ ‘uids’ =>$token[‘user_id’], ‘fields’ => ‘uid,first_name,last_name,screen_name,sex,bdate,photo_big’, ‘access_token’ => $token[‘access_token’], ‘v’ => ‘5.101’]; $userInfo = json_decode(file_get_contents(‘https://api.vk.com/method/users.get’ . ‘?’ . urldecode(http_build_query($params))), true); if (isset($userInfo[‘response’][0][‘id’])) < $userInfo = $userInfo[‘response’][0]; $result = true; >> if ($result) < echo «ID пользователя: » . $userInfo[‘id’] . ‘
‘; echo «Имя пользователя: » . $userInfo[‘first_name’] . ‘
‘; echo «Ссылка на профиль: » . $userInfo[‘screen_name’] . ‘
‘; echo «Пол: » . $userInfo[‘sex’] . ‘
‘; echo «День Рождения: » . $userInfo[‘bdate’] . ‘
‘; echo ‘‘; echo «
«; > > $_SESSION[‘id’] = $userInfo[‘id’];

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

Остались вопросы? Задавай в комментарии, всегда рады помочь!

• Сергей Котов
• 03.10.2019
• 26 857
• 22
• 12

Источник: kotoff.net

Авторизация пользователя ВКонтакте

Авторизация (от англ. authorization — разрешение) — это предоставление пользователю или группе пользователей прав на выполнение определенных действий или процесс подтверждения, данный при попытке выполнения действий.

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

Пройти авторизацию пользователь не сможет, если он не зарегистрирован в социальной сети. Это легко исправить, так как прямо на главной страничке есть возможность зарегистрироваться, введя имя, фамилию и год рождения. После нажатия на кнопку «Зарегистрироваться» необходимо следовать инструкции.

Если вы забыли пароль или он не подходит, вам необходимо нажать на кнопку «Забыли пароль?» в форме для добавления данных.

В этом случае перед вами откроется форма для восстановления доступа к странице. Вам необходимо проделать все необходимые действия, которые описаны на экране.

При успешной авторизации вы окажитесь на своей странице.

Это и есть авторизация пользователя в ВК.

Другие интересные статьи:

• ВКонтакте Добро пожаловать
• Двойная авторизация или безопасность страницы ВК
• ВКонтакте: бесплатная регистрация
• Как узнать email ВКонтакте?
• Как поменять логин ВКонтакте?
• Как узнать логин от чужой страницы в ВК?
• Как написать имя и фамилию на английском ВКонтакте?
• Как привязать две страницы ВКонтакте к одному номеру?

Источник: vkhelpnik.com

Авторизация ВКонтакте через WebView в Android приложении

Здравствуй дорогой друг, в этой статье, на простом примере мы рассмотрим, каким образом можно реализовать авторизацию и использование api социальной сети «ВКонтакте» без подключения официального SDK. Пример приложения можно скачать на github по ссылке в конце статьи.

Создаем проект, подключаем зависимости

В проекте я буду использовать kotlin, mvvm, binding, navgraph подразумевается, что ты уже знаешь, что это такое 🙂

Создаем новый проект на основе Empty Activity, я назову его OAuthWithVK_Example

Создание нового проекта

Добавляем в зависимости.

implementation ‘androidx.navigation:navigation-fragment-ktx:2.4.1’ implementation ‘androidx.navigation:navigation-ui-ktx:2.4.1’ implementation ‘com.squareup.retrofit2:retrofit:2.9.0’ implementation ‘com.squareup.retrofit2:converter-scalars:2.9.0’

Создаем необходимые классы и файлы

Создадим класс «App» расширяющий «Application», он будет представлять наше приложение и содержать экземпляр «AccountService» для хранения токена и экземпляр «Retrofit» с url для запросов к ВК api. Через companion object будем получать доступ к App и созданным экземплярам. По хорошему это нужно делать через DI, но для простоты примера сделаем так.

/** * Представляет приложение. */ class App : Application() < /** * Возвращает или устанавливает сервис хранения настроект. */ lateinit var accountService: IAccountService /** * Возвращает или устанавливает экземпляр ретрофита. */ lateinit var retrofit: Retrofit companion object < lateinit var application: App >override fun onCreate() < super.onCreate() application = this accountService = VKAccountService(getSharedPreferences(«vk_account», MODE_PRIVATE)) retrofit = Retrofit.Builder() .baseUrl(«https://api.vk.com/method/») .addConverterFactory(ScalarsConverterFactory.create()) .build() >>

Создадим интерфейс «IAccountService» и его реализацию «VKAccountService», сервис будет предоставлять возможность сохранять и получать token и userId.

/** * Определяет интерфейс получения и установки параметров аккаунта. */ interface IAccountService < /** * Возвращает или устанавливает токен. */ var token: String? /** * Возвращает или устанавливает идентификатор пользователя. */ var userId: String? >
Класс VKAccountService

Создадим класс активити с именем «MainActivity» и соответствующий ему файл разметки «activity_main». Он будет содержать FragmentContainerView для навигации.

/** * Представляет основное активити приложения. */ class MainActivity : AppCompatActivity() < private lateinit var appBarConfiguration: AppBarConfiguration private lateinit var binding: ActivityMainBinding override fun onCreate(savedInstanceState: Bundle?) < super.onCreate(savedInstanceState) binding = ActivityMainBinding.inflate(layoutInflater) setContentView(binding.root) setSupportActionBar(binding.toolbar) val navController = (supportFragmentManager.findFragmentById(R.id.nav_host_fragment) as NavHostFragment).navController appBarConfiguration = AppBarConfiguration(navController.graph) setupActionBarWithNavController(navController, appBarConfiguration) >override fun onSupportNavigateUp(): Boolean < val navController = findNavController(R.id.nav_host_fragment) return navController.navigateUp(appBarConfiguration) || super.onSupportNavigateUp() >>
Файл разметки activity_main

Обновим файл манифеста, указав корневое активити.

Для навигации по фрагментам понадобится файл «nav_graph».

Теперь создадим первый класс фрагмента для авторизации, назовем его «AuthFragment». Здесь нам нужен только виджет WebView, который создадим программно. Для открытия окна авторизации нужен url с параметрами, создаем приватное поле с именем «_authParams», оно будет содержать строку с необходимой конфигурацией, далее передадим ее в WebView. В методе onViewCreated будем открывать окно аутентификации, реагировать на события ‘Подтверждение разрешений’, ‘Ошибка ввода логина/пароля’, ‘Успех’ и др. В коде я оставил TODO куда нужно будет вставить ваш client_id приложения, как его получить рассмотрим в конце статьи.

/** * Представляет фрагмент ‘Войти в аккаунт’. */ class AuthFragment : Fragment() < private val webview by lazy < WebView(context!!) >private val _authParams = StringBuilder(«https://oauth.vk.com/authorize?»).apply < append(String.format(«%s=%s», URLEncoder.encode(«client_id», «UTF-8»), URLEncoder.encode(/*TODO Сюда вставить id приложения созданного в ВК в разделе «Developers»*/, «UTF-8»)) + «) append(String.format(«%s=%s», URLEncoder.encode(«redirect_uri», «UTF-8»), URLEncoder.encode(«https://oauth.vk.com/blank.html», «UTF-8»)) + «) append(String.format(«%s=%s», URLEncoder.encode(«display», «UTF-8»), URLEncoder.encode(«mobile», «UTF-8»)) + «) append(String.format(«%s=%s», URLEncoder.encode(«scope», «UTF-8»), URLEncoder.encode(VKAccountService.SCOPE, «UTF-8»)) + «) append(String.format(«%s=%s», URLEncoder.encode(«response_type», «UTF-8»), URLEncoder.encode(«token», «UTF-8»)) + «) append(String.format(«%s=%s», URLEncoder.encode(«v», «UTF-8»), URLEncoder.encode(«5.131», «UTF-8»)) + «) append(String.format(«%s=%s», URLEncoder.encode(«state», «UTF-8»), URLEncoder.encode(«12345», «UTF-8»)) + «) append(String.format(«%s=%s», URLEncoder.encode(«revoke», «UTF-8»), URLEncoder.encode(«1», «UTF-8»))) >.toString() override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle? ) = webview override fun onViewCreated(view: View, savedInstanceState: Bundle?) < super.onViewCreated(view, savedInstanceState) if (App.application.accountService.token == null) < webview.webViewClient = AuthWebViewClient(context!!) < status ->when(status) < AuthStatus.AUTH -> < >AuthStatus.CONFIRM -> < >AuthStatus.ERROR -> < Toast.makeText(context, «Не верный логин или пароль», Toast.LENGTH_LONG).show() >AuthStatus.BLOCKED -> < showAuthWindow() Toast.makeText(context, «Аккаунт заблокирован», Toast.LENGTH_LONG).show() >AuthStatus.SUCCESS -> < val url = webview.url!! val tokenMather = Pattern.compile(«access_token=\w+»).matcher(url) val userIdMather = Pattern.compile(«user_id=\w+»).matcher(url) // Если есть совпадение с патерном. if (tokenMather.find() userIdMather.find()) < val token = tokenMather.group().replace(«access_token=».toRegex(), «») val userId = userIdMather.group().replace(«user_id=».toRegex(), «») // Если токен и id получен. if (token.isNotEmpty() userId.isNotEmpty()) < App.application.accountService.token = token App.application.accountService.userId = userId navigateToInfo() >> > > > > else < navigateToInfo() >> override fun onStart() < super.onStart() if (App.application.accountService.token == null) < showAuthWindow() >> private fun showAuthWindow() < CookieManager.getInstance().removeAllCookies(null) webview.loadUrl(_authParams) >private fun navigateToInfo() < findNavController().navigate(R.id.action_AuthFragment_to_InfoFragment) >>

В зависимости от того какое событие сейчас происходит (ввод пароля, ошибка, заблокированный аккаунт), текущий url у WebView будет изменяться, на основе этого будем определять текущий статус аутентификации. Для этого создадим класс «AuthWebViewClient» расширяющий «WebViewClient», переопределим метод onPageFinished в котором будем парсить текущую открытую ссылку.

Перечислим статусы аутентификации в enum, который назовем «AuthStatus», этот enum будем передаваться кэлбеком из класса AuthWebViewClient во фрагмент.

/** * Перечисляет статусы аутентификации клиента. */ enum class AuthStatus < /** * Статус ввода логина и пароля. */ AUTH, /** * Статус подтверждения разрешений. */ CONFIRM, /** * Статус завершения авторизации с ошибкой. */ ERROR, /** * Статус заблокированного пользователя. */ BLOCKED, /** * Статус успешного завершения авторизации. */ SUCCESS >

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

Приступим к созданию второго фрагмента, здесь мы сделаем всего 1 запрос на получение списка друзей. На экране покажем кнопку для выхода, textview для показа кол-ва друзей и скролящийся textview для показа списка друзей.

Создадим фрагмент с именем «InfoFragment» и соответствующий ему xml файл с разметкой «info_fragment».

Файл разметки info_fragment

‘/> » android_layout_marginVertical=»16dp» android_scrollbars=»vertical»/>

Запрос на список друзей будем делать во ViewModel, эту вью модель передадим в биндинг, LiveData сама будет устанавливать данные в TextView.

/** * Определяет модель представления фрагмента ‘Инфо’. */ class InfoViewModel: ViewModel() < private val _count = MutableLiveData() private val _friends = MutableLiveData() /** * Возвращает кол-во друзей. */ val count: LiveData = _count /** * Возвращет список друзей. */ val friends: LiveData = _friends init < viewModelScope.launch < val response = App.application.retrofit.create(FriendsGetRequest::class.java).friendsGet( App.application.accountService.token. «5.131», «name» ) val friendsList = StringBuilder() val items = JSONObject(response).getJSONObject(«response»).getJSONArray(«items») for (i in 0 until items.length()) < friendsList.append( «$$n» ) > _count.postValue(JSONObject(response).getJSONObject(«response»).getString(«count»)) _friends.postValue(friendsList.toString()) > > >

Осталось написать интерфейс «FriendsGetRequest» с запросом для ретрофит и на этом с программной частью будем заканчивать 🙂

Теперь разберемся, как получить client_id, это один из параметров запроса на авторизацию, его выдает ВК для понимания, какое приложение собирается обращаться к его api. Что бы его получить зайдите на свою страницу ВК и найдите меню «Управление», если его нет в списке, нужно добавить его в настройках страницы.

Кликнув по меню «Управление» мы попадем в раздел «Мои приложения», для создания нового приложения нажмите кнопку «Создать»

Раздел «Мои приложения»

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

Когда приложение будет создано перейдите в меню «Настройки», там будет указан client_id, который нужно вставить в код на место TODO, все остальные настройки по желанию 🙂

Меню настройки приложения

Источник: habr.com