Авторизация на сайте через ВКонтакте

Роман Гринько Web-разработка 1891
Авторизация на сайте через ВКонтакте

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

  1. На сайте, пользователь нажимает на ссылку «Войти», открывается страница VK, где он разрешит приложению доступ к своим данным.
  2. После подтверждения браузер пользователя будет перенаправлен по адресу, указанному при открытии диалога авторизации. К URL добавляется GET-параметр с кодом авторизации.
  3. Скрипт выполняет ответный запрос с полученным кодом и ключом приложения для получения access_token.
  4. Полученный в ответе access_token, скрипт использует для запроса к данным пользователя.

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

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

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

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

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

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

$params = array(
	'client_id'     => 'ID приложения',
	'redirect_uri'  => 'https://example.com/oauth-vk.php',
	'scope'         => 'email',
	'response_type' => 'code',
	'state'         => 'https://example.com/page-1'
);
 
$url = 'https://oauth.vk.com/authorize?'.urldecode(http_build_query($params));
echo '<a href="'.$url.'">Войти через ВКонтакте</a>';

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

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

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

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

После того как пользователь дал разрешение, он возвращается на redirect_uri, к URL добавляются GET-параметры:
https://example.com/oauth-vk.php?code=1234567890&state=https://example.com/page-1

Далее запрашивается access_token (в ответе с токеном будет e-mail). После этого выполняется метод users.get, который возвращает ID, имя, фамилию и URL аватарки.

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

<?php
if (!empty($_GET['code'])) {
	$params = array(
		'client_id'     => 'ID приложения',
		'client_secret' => 'Защищённый ключ',
		'redirect_uri'  => 'https://example.com/oauth-vk.php',
		'code'          => $_GET['code']
	);
	
	// Получение 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'])) {
		// Получили email
		$email = $data['email'];
 
		// Получим данные пользователя
		$params = array(
			'v'            => '5.52',
			'uids'         => $data['user_id'],
			'access_token' => $data['access_token'],
			'fields'       => 'photo_big',
		);
 
		$info = file_get_contents('https://api.vk.com/method/users.get?' . urldecode(http_build_query($params)));
		$info = json_decode($info, true);	
		
		echo $email;
		print_r($info);
	}
}

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


ivan_ivanov@gmail.com
Array
(
    [response] => Array
        (
            [0] => Array
                (
                    [first_name] => Иван
                    [id] => 12345678
                    [last_name] => Иванов
                    [photo_big] => https://vk.com/images/camera_200.png?ava=1
                )

        )

)

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