От автора: в данном уроке мы с Вами поговорим об авторизации пользователей на сайте. Но речь пойдет не о классической авторизации, а об авторизации с использованием ресурсов социальной сети ВКонтакте. В данный момент социальные сети пользуются огромнейшей популярностью среди пользователей Интернета и иногда очень удобно использовать у себя на сайте для авторизации непосредственно информацию добавленную пользователем в социальную сеть.
Введение
Для авторизации через социальную сеть ВКонтакте, используется открытый протокол OAuth 2.0. OAuth — это открытый протокол авторизации, который позволяет получить Вам – разработчикам — доступ к ресурсам пользователя хранящимся к примеру в социальной сети ВКонтакте. При этом пользователю вовсе не нужно сообщать Вам свой логин и пароль для доступа к его данным.
Данная система авторизации работает следующим образом. Для начала пользователь должен пройти авторизацию в социальной сети, для этого со своего сайта Вы перенаправляете его на определенный адрес социальной сети (о котором мы еще поговорим). Затем после успешной авторизации — Вконтаке, обратно перенаправит пользователя на Ваш сайт, при этом Вам будет передан специальный код, который необходим для получения данных пользователя и свидетельствующий об успешной авторизации.
Теперь, так как мы будем работать непосредственно с социальной сетью, наш скрипт должен располагаться на реальном сервере. Так как будет проходить постоянный обмен данными между нашим скриптом и сервисом ВКонтакте. При этом на локальном компьютере (к примеру Denwer) скрипт работать не будет.
Для удобства работы с удаленным сервером, мы будем использовать текстовый редактор Notepad++, который содержит встроенный плагин по работе с протоколом FTP. Используя который, мы можем открывать и редактировать файлы скрипта непосредственно на удаленном сервере. Для этого запускаем текстовый редактор открываем меню Plugins, далее NppFTP и активируем Show NppFTP Window. При этом будет открыто окно для обзора файлов и папок удаленных серверов. В данном окне необходимо открыть настройки (кнопка Settings), а именно настройки профиля (Profile Settings) и добавить новый профиль для соединения с ftp сервером (при этом необходимо указать настройки подключения).
Затем, кликнув по кнопке Connect выполняем соединение через FTP:
Для добавления новых файлов, достаточно правой кнопкой кликнуть по соответствующей папке и выбрать Create new file. Открыть соответствующий файл можно двойным щелчком мыши.
Создание приложения в контакте
Для создания механизма авторизации через социальную сеть ВКонтакте, у Вас обязательно должен быть ее акаунт. Также необходимо создать приложение, потому как данные пользователей получит именно Ваше созданное приложение, которое также необходимо для идентификации того, кто получает данные.
Итак, создаем приложение, для этого переходим по ссылке //vk.com/editapp?act=create:
Вводим название приложения и отмечаем галочкой пункт веб-сайт, вводим путь к сайту и его базовый домен (путь к сайту может содержать домен и папку в которой расположен сайт или тестовый скрипт) и нажимаем “Подключить приложение”.
Далее необходимо подтвердить создание приложение путем ввода специального кода который придет на Ваш мобильный телефон. После этого Ваше приложение создано.
Далее переходим на вкладку настойки и копируем идентификатор приложения и его секретный ключ, которые понадобятся далее. ВАЖНО: ни кому не сообщайте идентификатор приложения и его секретный ключ и не выкладывайте их в открытый доступ, так как они могут быть использованы злоумышленниками.
Еще хотел бы обратить Ваше внимание на следующую страницу: //vk.com/developers.php?oid=-1&p=%D0%90%D0%B2%D1%82%D0%BE%D1%80%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D1%8F_%D1%81%D0%B0%D0%B9%D1%82%D0%BE%D0%B2. Это документация по теме данного урока.
Авторизация ВКонтакте
Первым делом давайте создадим страницу с ссылкой Авторизация, кликнув по которой пользователь будет перенаправлен на страницу авторизации ВКонтакте. Для этого создадим файл index.php:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<? session_start(); ?> <!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" href="css/style.css" type="text/css"> <title>Тестовый сайт</title> </head> <body> <div id="container"> <h2>Контент сайта</h2> <p> <strong><a href="auth.php">Авторизация</a></strong> </p> </div> </body> </html> |
Данная страница выглядит следующим образом:
Как Вы видите путь в ссылке Авторизация ведет на вспомогательный файл auth.php, который будет обрабатывать данные нашего скрипта. Теперь давайте создадим файл конфигурации config.php и добавим несколько констант:
|
1 2 3 4 5 6 7 |
session_start(); define("APP_ID",'идентификатор приложения'); define("APP_SECRET",'Секретный ключ'); define("REDIRECT_URI",'//avtomirock.esy.es/auth.php'); define("URL_ACCESS_TOKEN",'//oauth.vk.com/access_token'); define("URL_AUTH ",'//oauth.vk.com/authorize'); define("URL_GET_USER",'//api.vk.com/method/users.get'); |
Где: APP_ID – идентификатор Вашего приложения, APP_SECRET – секретный ключ, REDIRECT_URI – путь на который ВКонтакте пришлет перенаправит пользователя, URL_ACCESS_TOKEN – путь по которому необходимо выполнить запрос для получения access_token (ключ доступа к данным пользователя), URL_AUTH – путь страницы авторизации ВКонтакте, URL_GET_USER – путь по которому необходимо выполнить запрос для получения данных пользователя. Теперь создадим новый файл (Auth_VK.php) и добавим в него следующий код:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<? class Auth_Vk { private $code; private $token; private $uid; public function __construct() { require "config.php"; } public function set_code($code) { $this->code = $code; } public function set_token($token) { $this->token = $token; } public function set_uid($id) { $this->uid = $id; } public function redirect($url) { header('HTTP/1.1 301 Moved Permanently'); header("Location:".$url); exit(); } } ?> |
Данный класс – это логическое ядро нашего скрипта. Свойства класса: $code – код который пришлет ВКонтакте в результате успешной авторизации пользователя, $token – access_token – ключ доступа к данным пользователя; $uid – идентификатор пользователя в системе ВКонтакте. В конструкторе класса мы подключим файл конфигурации. Метод redirect() – необходим для перенаправления пользователя по адресу, который передается в аргументе при вызове метода. Вспомогательные методы set_code(), set_token(), set_uid() – необходимы для установки закрытых свойств класса. Теперь давайте создадим файл auth.php и добавим в него следующий код:
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<? require "Auth_Vk.php"; $o = new Auth_Vk(); if(!$_GET['code']) { $query = "client_id=".APP_ID."&scope=offline&redirect_uri=".REDIRECT_URI."&response+type=code"; $o->redirect(URL_AUTH."?".$query); } ?> |
То есть в начале подключаем ранее созданный класс, затем создаем его объект. Как я говорил ранее после успешной авторизации, ВКонтакте пришлет в данный файл данные, используя GET параметры (то есть через адресную строку). Это будет параметр code – специальный код необходимый для получения access_token. Поэтому если данного параметра нет, значит необходимо перенаправить пользователя на страницу авторизации ВКонтакте. При этом через адресную строку необходимо передать следующие параметры:
client_id – идентификатор приложения пользователя;
scope – права доступа приложения (offline — означает доступ к данным пользователя в любое время);
redirect_uri – путь по которому будет выслан параметр code. Этот адрес должен находиться в пределах домена, указанного в настройках приложения.;
response_type – ответом от сервера должен быть параметр code.
Теперь давайте выполним авторизацию (переходим по ссылке Авторизция):
Вводим логин и пароль, затем необходимо разрешить приложению получать доступ к данным пользователя (в данном случае в роли пользователя выступаем мы и разрешаем своему же приложению получить наши данные). После успешной авторизации Вконтакте перенаправляет нас обратно на страницу auth.php и через адресную строку передает параметр code.
Получение access_code
Далее необходим получить ключ доступа к данным пользователя, используя полученный параметр code. Для этого в файл auth.php добавим следующий код:
|
1 2 3 4 5 6 7 |
if($_GET['code']) { $o->set_code($_GET['code']); $res = $o->get_token(); } if($_GET['error']) { exit($_GET['error_description']); } |
Кстати если во время авторизации возникли ошибки, то вместо параметра code, придет параметр error – код ошибки, вместе с ее описанием — error_description. Поэтому если мы действительно получили code, значит, запишем его в свойство класса и вызовем метод get_token(), который получит access_token. Теперь в класс Auth_Vk добавим код метода get_token():
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
public function get_token() { if(!$this->code) { exit("Не верный код"); } $ku = curl_init(); $query = "client_id=".APP_ID."&client_secret=".APP_SECRET."&code=".$this->code."&redirect_uri=".REDIRECT_URI; curl_setopt($ku,CURLOPT_URL,URL_ACCESS_TOKEN."?".$query); curl_setopt($ku,CURLOPT_RETURNTRANSFER,TRUE); $result = curl_exec($ku); curl_close($ku); $ob = json_decode($result); if($ob->access_token) { $this->set_token($ob->access_token); $this->set_uid($ob->user_id); return TRUE; } elseif($ob->error) { $_SESSION['error'] = "Ошибка"; return FALSE; } } |
Для получения access_token необходимо отправить запрос по адресу хранящимся в константе URL_ACCESS_TOKEN, и передать следующие параметры, используя метод GET:
client_id – идентификатор приложения;
client_secret – секретный код;
code – полученный code;
redirect_uri – здесь нужно указать тот же адрес, что и для получения code.
Запрос отправлять будем используя библиотеку CURL. При этом ответ от сервера ВКонтакте придет в формате строки JSON. Значит, используя функцию json_decode(), декодируем данную строку в объект. Объект мы получим следующего вида:
В случае ошибки мы получим следующее:
То есть мы получим объект у которого будет либо свойство access_token, либо свойство error. Поэтому, если мы получаем access_token – запишем его значение и идентификатор пользователя в соответствующие свойства класса и вернем TRUE, если же придет ошибка — запишем ее в сессию и вернем FALSE.
Получение данных пользователя
После того, как мы получили ключ доступа access_token – можно получить данные пользователя. Для этого в файл auth.php добавим следующий код (после вызова метода get_token()):
|
1 2 3 4 5 6 |
if($res) { $o->get_user(); } else { exit($_SESSION['error']); } |
Теперь давайте опишем метод get_user(), который получит и вернет данные пользователя:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
public function get_user() { if(!$this->token) { exit('Wrong code'); } if(!$this->uid) { exit('Wrong code'); } $query = "uids=".$this->uid."&fields=first_name,last_name,nickname,screen_name,sex,bdate,city, country,timezone,photo,photo_medium,photo_big,has_mobile,rate,contacts, education,online,counters&access_token=".$this->token; //echo $query; $kur = curl_init(); curl_setopt($kur, CURLOPT_URL, URL_GET_USER."?".$query); curl_setopt($kur, CURLOPT_SSL_VERIFYPEER, false); curl_setopt($kur, CURLOPT_SSL_VERIFYHOST, false); curl_setopt($kur,CURLOPT_RETURNTRANSFER,TRUE); $result2 = curl_exec($kur); curl_close($kur); $_SESSION['user'] = json_decode($result2); $this->redirect("//avtomirock.esy.es"); } |
Для получения данных пользователя необходимо отправить запрос по адресу, хранящимся в константе URL_GET_USER и отправить следующие данные, используя метод GET:
uids – идентификатор пользователя, полученный вместе с access_token;
fields – данные которые необходимо получить (подробнее о данных можно посмотреть в документации //vk.com/developers.php?oid=-1&p=users.get)
access_token – access_token полученный ранее.
Как обычно запрос отправляем используя библиотеку CURL. Данные как обычно придут в формате JSON строки, поэтому декодируем их и сохраняем в сессии для дальнейшего вывода на экран. И сразу выполняем редирект на главную страницу нашего сайта. Давайте распечатаем объект данных пользователя, который мы получи после декодирования JSON строки:
Теперь осталось вывести данные пользователя в нужном Вам месте, либо сохранить их в базе данных и т.д. Я выведу данные пользователя сразу под ссылкой Авторизация:
|
1 2 3 4 5 6 7 8 9 |
<? if($_SESSION['user']) { $user = $_SESSION['user']->response[0]; //print_r($user); } ?> <img src="<? echo $user->photo_medium;?>"> <p><?php echo $user->first_name;?></p> <p><?php echo $user->last_name;?></p> |
На этом данный урок завершен. Всего Вам доброго и удачного кодирования!!!
Комментарии (19)