Пользователи предпочитают авторизироваться мгновенно, в один клик, и не затрачивать время на регистрацию через электронную почту. Всю суть данной проблемы могут понять люди, использующие данную платформу для продажи товаров в интернет-магазине .
WordPress по умолчанию не предоставляет возможности входа через социальные сети. Если пользователь желает, чтобы его клиенты заходили таким способом, ему придется приобрести платные разработки или использовать специальный бесплатный плагин. Простота регистрации и вход через социальные сети на любом сайте на wordprees очень важны. Если Вы предложите посетителям проделывать данную процедуру путем заполнения целого ряда полей с помощью электронной почты, то наверняка потеряете массу потенциальных клиентов.
В данной статье подобраны 10 плагинов входа через социальные сети для Wordpress , которые позволят Вашему сайту стать удобным и выглядеть профессионально. Для желающих собственными руками создать виджет с социальными кнопками, рекомендуем ознакомиться с материалами по теме .

Social Login

Super Socializer

Nextend Facebook Connect

WordPress Social Login

Social Login for WordPress

Gigya – Social Infrastructure

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

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

Введение

Для авторизации через социальную сеть ВКонтакте, используется открытый протокол OAuth 2.0. OAuth - это открытый протокол авторизации, который позволяет получить Вам – разработчикам — доступ к ресурсам пользователя хранящимся к примеру в социальной сети ВКонтакте. При этом пользователю вовсе не нужно сообщать Вам свой логин и пароль для доступа к его данным.

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

Фреймворк YII2. Быстрая разработка с современным PHP фреймворком

Узнай тонкости современной веб-разработки с помощью фреймворка YII2

Теперь, так как мы будем работать непосредственно с социальной сетью, наш скрипт должен располагаться на реальном сервере. Так как будет проходить постоянный обмен данными между нашим скриптом и сервисом ВКонтакте. При этом на локальном компьютере (к примеру Denwer) скрипт работать не будет.

Для удобства работы с удаленным сервером, мы будем использовать текстовый редактор Notepad++, который содержит встроенный плагин по работе с протоколом FTP. Используя который, мы можем открывать и редактировать файлы скрипта непосредственно на удаленном сервере. Для этого запускаем текстовый редактор открываем меню Plugins, далее NppFTP и активируем Show NppFTP Window. При этом будет открыто окно для обзора файлов и папок удаленных серверов. В данном окне необходимо открыть настройки (кнопка Settings), а именно настройки профиля (Profile Settings) и добавить новый профиль для соединения с ftp сервером (при этом необходимо указать настройки подключения).

Затем, кликнув по кнопке Connect выполняем соединение через FTP:

Для добавления новых файлов, достаточно правой кнопкой кликнуть по соответствующей папке и выбрать Create new file. Открыть соответствующий файл можно двойным щелчком мыши.

Создание приложения в контакте

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

Итак, создаем приложение, для этого переходим по ссылке https://vk.com/editapp?act=create:

Вводим название приложения и отмечаем галочкой пункт веб-сайт, вводим путь к сайту и его базовый домен (путь к сайту может содержать домен и папку в которой расположен сайт или тестовый скрипт) и нажимаем “Подключить приложение”.

Далее переходим на вкладку настойки и копируем идентификатор приложения и его секретный ключ, которые понадобятся далее. ВАЖНО: ни кому не сообщайте идентификатор приложения и его секретный ключ и не выкладывайте их в открытый доступ, так как они могут быть использованы злоумышленниками.

Еще хотел бы обратить Ваше внимание на следующую страницу: http://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:

Данная страница выглядит следующим образом:

Session_start(); define("APP_ID","идентификатор приложения"); define("APP_SECRET","Секретный ключ"); define("REDIRECT_URI","http://avtomirock.esy.es/auth.php"); define("URL_ACCESS_TOKEN","https://oauth.vk.com/access_token"); define("URL_AUTH ","http://oauth.vk.com/authorize"); define("URL_GET_USER","https://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) и добавим в него следующий код:

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 и добавим в него следующий код:

redirect(URL_AUTH."?".$query); } ?>

То есть в начале подключаем ранее созданный класс, затем создаем его объект. Как я говорил ранее после успешной авторизации, ВКонтакте пришлет в данный файл данные, используя GET параметры (то есть через адресную строку). Это будет параметр code – специальный код необходимый для получения access_token. Поэтому если данного параметра нет, значит необходимо перенаправить пользователя на страницу авторизации ВКонтакте. При этом через адресную строку необходимо передать следующие параметры:

client_id – идентификатор приложения пользователя;

scope – права доступа приложения (offline — означает доступ к данным пользователя в любое время);

redirect_uri – путь по которому будет выслан параметр code. Этот адрес должен находиться в пределах домена, указанного в настройках приложения.;

response_type – ответом от сервера должен быть параметр code.

Теперь давайте выполним авторизацию (переходим по ссылке Авторизция):

Вводим логин и пароль, затем необходимо разрешить приложению получать доступ к данным пользователя (в данном случае в роли пользователя выступаем мы и разрешаем своему же приложению получить наши данные). После успешной авторизации Вконтакте перенаправляет нас обратно на страницу auth.php и через адресную строку передает параметр code.

Получение access_code

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():

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:

Запрос отправлять будем используя библиотеку CURL. При этом ответ от сервера ВКонтакте придет в формате строки JSON. Значит, используя функцию json_decode(), декодируем данную строку в объект. Объект мы получим следующего вида:

В случае ошибки мы получим следующее:

То есть мы получим объект у которого будет либо свойство access_token, либо свойство error. Поэтому, если мы получаем access_token – запишем его значение и идентификатор пользователя в соответствующие свойства класса и вернем TRUE, если же придет ошибка — запишем ее в сессию и вернем FALSE.

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

После того, как мы получили ключ доступа access_token – можно получить данные пользователя. Для этого в файл auth.php добавим следующий код (после вызова метода get_token()):

If($res) { $o->get_user(); } else { exit($_SESSION["error"]); }

Теперь давайте опишем метод get_user(), который получит и вернет данные пользователя:

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("http://avtomirock.esy.es"); }

Для получения данных пользователя необходимо отправить запрос по адресу, хранящимся в константе URL_GET_USER и отправить следующие данные, используя метод GET:

uids – идентификатор пользователя, полученный вместе с access_token;

fields – данные которые необходимо получить (подробнее о данных можно посмотреть в документации http://vk.com/developers.php?oid=-1&p=users.get)

access_token – access_token полученный ранее.

Как обычно запрос отправляем используя библиотеку CURL. Данные как обычно придут в формате JSON строки, поэтому декодируем их и сохраняем в сессии для дальнейшего вывода на экран. И сразу выполняем редирект на главную страницу нашего сайта. Давайте распечатаем объект данных пользователя, который мы получи после декодирования JSON строки:

Теперь осталось вывести данные пользователя в нужном Вам месте, либо сохранить их в базе данных и т.д. Я выведу данные пользователя сразу под ссылкой Авторизация:

response; //print_r($user); } ?> photo_medium;?>">

first_name;?>

last_name;?>

На этом данный урок завершен. Всего Вам доброго и удачного кодирования!!!