Информационный портал

Информационно-новостной портал

Новости рекламы и маркетинга. Новости Интернета.
Море полезной информации на сайте RetailDepartment.ru
Поделиться ссылкой с друзьями

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

Twitter
Нравится
RedLine

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

Если вы следили за выходом статей, то должны быть в курсе, что мы уже рассмотрели, как создать аутентификацию через следующие социальные сети:

Сегодня мы рассмотрим более обобщённый пример с прикруткой к базе данных и прочими фишками.

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

Саму библиотеку вы можете найти в исходниках, а также на GitHub. Это моя первая раздача, так что прошу строго не судить. На данный момент, поддерживается работа с шестью соц сетями: ВКонтакте, Одноклассниками, Mail.ru, Yandex, Google и Facebook. В будущем я планирую развивать и совершенствовать данную систему. Поскольку библиотека выложена в свободном доступе на GitHub, я буду рад всяческому содействию с вашей стороны. Ну а для того чтобы посмотреть, как работает SocialAuther, давайте двигаться дальше.

Сразу же хочу уточнить одну деталь. Для работы библиотеки, вам понадобится версия PHP 5.3 и выше. Для того чтобы понять, как использовать библиотеку SocialAuther, я буду приводить как частные, так и общие для этого урока примеры.

Автозагрузка классов

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

require_once 'lib/SocialAuther/autoload.php';

Использование SocialAuther с одной отдельной социальной сетью

Перед тем, как приступить к более обширному примеру, давайте рассмотрим использование библиотеки в рамках одной социальной сети. К примеру, “ВКонтакте”. Для начала нам нужно сконфигурирован массив с параметрами: `client_id`, `client_secret`, `redirect_uri`:

// конфигурация настроек адаптера
$vkAdapterConfig = array(
    'client_id'     => '3078654',
    'client_secret' => 'zrCHcmKAcBvblSUIBIwu',
    'redirect_uri'  => 'http://localhost/vk-auth'
);

Далее создаём объект класса адаптера ВКонтакте и передаём сконфигурированные параметры:

// создание адаптера и передача настроек
$vkAdapter = new SocialAuther\Adapter\Vk($vkAdapterConfig);

После того, как адаптер сконфигурирован, создаём объект класса SocialAuther:

// передача адаптера в SocialAuther
$auther = new SocialAuther\SocialAuther($vkAdapter);

Для того чтобы сгенерировать ссылку аутентификации, достаточно вызвать следующий метод:

if (!isset($_GET['code'])) {
    echo '<p><a href="' . $vkAdapter->getAuthUrl() . '">Аутентификация через ВКонтакте</a></p>';
}

Для совершения аутентификации достаточно вызвать метод authenticate(), который вернёт true, если всё произойдёт хорошо, и false, если возникнет ошибка:

if (isset($_GET['code'])) {
    if ($auther->authenticate()) {
            if (!is_null($auther->getSocialId()))
                echo "Социальный ID пользователя: " . $auther->getSocialId() . '<br />';

            if (!is_null($auther->getName()))
                echo "Имя пользователя: " . $auther->getName() . '<br />';

            if (!is_null($auther->getEmail()))
                echo "Email пользователя: " . $auther->getEmail() . '<br />';

            if (!is_null($auther->getSocialPage()))
                echo "Ссылка на профиль пользователя: " . $auther->getSocialPage() . '<br />';

            if (!is_null($auther->getSex()))
                echo "Пол пользователя: " . $auther->getSex() . '<br />';

            if (!is_null($auther->getBirthday()))
                echo "День Рождения: " . $auther->getBirthday() . '<br />';

            // аватар пользователя
            if (!is_null($auther->getAvatar()))
                echo '<img src="' . $auther->getAvatar() . '" />'; echo "<br />";
        }
}

Далее мы можем получить следующую информацию, которая нужна практически каждому: социальный ID пользователя, имя, email, ссылка на профиль пользователя, пол, день рождения и ссылку на аватар. Если данных в этом поле нет, то метод вернёт null.

Работать с остальными социальными сетями можно практически таким же образом. Более подробную информацию можете найти на GitHub.

Использование SocialAuther с несколькими социальными сетями

Теперь мы займёмся применением SocialAuther при подключении нескольких социальных сетей.

Конфигурация параметров приложений

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

$adapterConfigs = array(
    'vk' => array(
        'client_id'     => '3774741',
        'client_secret' => '3nLWEs45iWeKypmVR2CU',
        'redirect_uri'  => 'http://localhost/auth/?provider=vk'
    ),
    'odnoklassniki' => array(
        'client_id'     => '168635560',
        'client_secret' => 'C342554C028C0A76605C7C0F',
        'redirect_uri'  => 'http://localhost/auth?provider=odnoklassniki',
        'public_key'    => 'CBADCBMKABABABABA'
    ),
    'mailru' => array(
        'client_id'     => '770076',
        'client_secret' => '5b8f8906167229feccd2a7320dd6e140',
        'redirect_uri'  => 'http://localhost/auth/?provider=mailru'
    ),
    'yandex' => array(
        'client_id'     => 'bfbff04a6cb60395ca05ef38be0a86cf',
        'client_secret' => '219ba8388d6e6af7abe4b4b119cbee48',
        'redirect_uri'  => 'http://localhost/auth/?provider=yandex'
    ),
    'google' => array(
        'client_id'     => '333193735318.apps.googleusercontent.com',
        'client_secret' => 'lZB3aW8gDjIEUG8I6WVcidt5',
        'redirect_uri'  => 'http://localhost/auth?provider=google'
    ),
    'facebook' => array(
        'client_id'     => '613418539539988',
        'client_secret' => '2deab137cc1d254d167720095ac0b386',
        'redirect_uri'  => 'http://localhost/auth?provider=facebook'
    )
);

1. Ключи 'vk', 'odnoklassniki', 'mailru', 'yandex', 'google' и 'facebook' выбраны не просто так. Эти названия в дальнейшем мы будем использовать для динамического создания каждого из адаптеров.

2. Обратите внимание, что к каждому `redirect_uri` мы приписали параметр `adapter`, который равен названию соц сети. Эти ссылки (пр. http://localhost/auth?provider=facebook), вам необходимо прописать в настройках каждого из приложения. Для ВКонтакте - vk, для Одноклассников - odnoklassniki и так далее. Благодаря данному параметру `provider`, мы сможем легко определить, через какую социальную сеть пытается авторизоваться пользователь.

Создание адаптеров классовp

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

$adapters = array();
foreach ($adapterConfigs as $adapter => $settings) {
    $class = 'SocialAuther\Adapter\\' . ucfirst($adapter);
    $adapters[$adapter] = new $class($settings);
}

Для того, чтобы было яснее, возьмём маленький пример. Берём фрагмент массива параметров:

$adapterConfigs = array(
...
    'odnoklassniki' => array(
        'client_id'     => '163586560',
        'client_secret' => 'C342505C754C028C0A766C0F',
        'redirect_uri'  => 'http://localhost/auth?provider=odnoklassniki',
        'public_key'    => 'CBADCBMKABABABABA'
    ),
...

Допустим, в цикле foreach пришёл черёд данного элемента с ключом `odnoklassniki`. Название ключа записывается в переменную $adapter, а массив с параметрами - в переменную $settings. Далее первая операция создаст имя класса, а вторая задаст ему параметры и запишет адаптер в общий массив.

// имя класса формируется автоматом - SocialAuther\Adapter\Odnoklassniki($adapter);
$class = 'SocialAuther\Adapter\\' . ucfirst($adapter);

// помещаем объект класса SocialAuther\Adapter\Odnoklassniki в общий массив $adapters
$adapters[$adapter] = new $class($settings);

Генерация ссылок аутентификации

Теперь где-то в html коде делаем проверку на наличие GET параметра code, и если он присутствует, то мы можем выводить ссылки для аутентификации:

if (!isset($_GET['code'])) {
    foreach ($adapters as $title => $adapter) {
        echo '<p><a href="' . $adapter->getAuthUrl() . '">Аутентификация через ' . ucfirst($title) . '</a></p>';
    }
}

Создание объекта SocialAuther для аутентификации пользователя

Создать объект SocialAuther и авторизовать пользователя мы можем, если к нам придёт GET параметр provider. Также если название адаптера совпадает хоть с одним из наших хранящихся в общем массиве, создаём объект класса SocialAuther и передаём адаптер той социальной сети, через которую авторизовался пользователь:

if (isset($_GET['provider']) && array_key_exists($_GET['provider'], $adapters)) {
	$auther = new SocialAuther\SocialAuther($adapters[$_GET['provider']]);
}

Аутентификация пользователя и получение данных

Теперь, когда у нас есть объект SocialAuther, можем вызывать метод authenticate(), а затем получить данные о пользователе:

if ($auther->authenticate()) {
    $auther->getProvider();
    $auther->getSocialId();
    $auther->getName();
    $auther->getEmail();
    $auther->getSocialPage();
    $auther->getSex();
    $auther->getBirthday());
    $auther->getAvatar();
}

Прикрутка к БД

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

Создание БД и таблицы

Для данного урока создайте любую MySQL базу данных. Я назову её `auth`. В ней, с помощью данного кода, сгенерируйте таблицу:

CREATE TABLE `users` (
    `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
    `provider` ENUM('vk', 'odnoklassniki', 'mailru', 'yandex', 'google', 'facebook') NOT NULL,
    `social_id` VARCHAR(255) NOT NULL,
    `name` VARCHAR(255) NOT NULL,
    `email` VARCHAR(255) NOT NULL,
    `social_page` VARCHAR(255) NOT NULL,
    `sex` ENUM('male', 'female') NOT NULL,
    `birthday` DATE NOT NULL,
    `avatar` VARCHAR(255) NOT NULL
) ENGINE = InnoDB CHARACTER SET utf8 COLLATE utf8_general_ci;

Поле id - это стандартный автоинкрементный индекс. В колонку `provider` записываем название социальной сети учётной записи пользователя. Все остальные поля соответствуют методам, которые мы можем вызвать от объекта SocialAuther для получения информации о пользователе.

Настройка подключения к БД

Данный функционал я предлагаю вынести в отдельный файл. К примеру, config.inc.php:

$db = mysql_connect('localhost', 'имя пользователя', 'пароль');
mysql_select_db('auth');
mysql_query("SET NAMES utf8");

Тут мы подключились к базе, выбрали таблицу и задали кодировку UTF8. Теперь данный файл можно присоединить к index.php и работать с таблицей.

Вставка нового пользователя

Итак, тут нам нужно предусмотреть следующее: если у нас в базе есть пользователь с социальным id и названием адаптера соц сети, которые мы получили в результате аутентификации, то пользователь уже ранее входил в нашу систему, и запись в таблице о нём есть. Если же такой записи нет, то мы должны записать нового пользователя в БД:

if ($auther->authenticate()) {

    $result = mysql_query(
        "SELECT *  FROM `users` WHERE `provider` = '{$auther->getProvider()}' AND `social_id` = '{$auther->getSocialId()}' LIMIT 1"
    );

    $record = mysql_fetch_array($result);
    if (!$record) {
        $values = array(
            $auther->getProvider(),
            $auther->getSocialId(),
            $auther->getName(),
            $auther->getEmail(),
            $auther->getSocialPage(),
            $auther->getSex(),
            date('Y-m-d', strtotime($auther->getBirthday())),
            $auther->getAvatar()
        );

        $query = "INSERT INTO `users` (`provider`, `social_id`, `name`, `email`, `social_page`, `sex`, `birthday`, `avatar`) VALUES ('";
        $query .= implode("', '", $values) . "')";
        $result = mysql_query($query);
    }
}

Тут всё происходит так, как я и говорил. Сначала проверяем, есть ли в таблице пользователь с пришедшем к нам id и provider. Если нет, то формируем массив значений, затем выполняем INSERT запрос.

Привязка к сессии

В принципе, нам осталось сделать только одно - привязать нашего пользователя к сессии, чтобы в дальнейшем, на других страницах, мы могли доставать информацию о нём. Делается это очень просто. Для начала в файл config.inc.php вписываем функцию активации сессий:

Далее в index.php, после блока проверки существования пользователя, формируем объект стандартного класса (поля) и записываем в них информацию о пользователе:

$user = new stdClass();
$user->provider   = $auther->getProvider();
$user->socialId   = $auther->getSocialId();
$user->name       = $auther->getName();
$user->email      = $auther->getEmail();
$user->socialPage = $auther->getSocialPage();
$user->sex        = $auther->getSex();
$user->birthday   = $auther->getBirthday();
$user->avatar     = $auther->getAvatar();

Затем записываем только что созданный объект в сессию под ключом `user`.

$_SESSION['user'] = $user;

Теперь на любой другой странице (к примеру, info.php) достаём данные из сессии и выводим на экран:

<?php require_once 'config.inc.php'; ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <title></title>
</head>
<body>

<?php if (isset($_SESSION['user'])) {
    $user = $_SESSION['user'];
    if (!is_null($user->socialId))
    echo "Социальный ID пользователя: " . $user->socialId . '<br />';

    if (!is_null($user->name))
    echo "Имя пользователя: " . $user->name . '<br />';

    if (!is_null($user->email))
    echo "Email: пользователя: " . $user->email . '<br />';

    if (!is_null($user->socialPage))
    echo "Ссылка на профиль пользователя: " . $user->socialPage . '<br />';

    if (!is_null($user->sex))
    echo "Пол пользователя: " . $user->sex . '<br />';

    if (!is_null($user->birthday))
    echo "День Рождения: " . $user->birthday . '<br />';

    // аватар пользователя
    if (!is_null($user->avatar))
    echo '<img src="' . $user->avatar . '" />'; echo "<br />";
    echo '<p><a href="/logout.php">Выйти из системы</a></p>';
} else {
    echo '<p><a href="/index.php">Войдите в систему</a> для того, чтобы увидеть данный материал.</p>';
} ?>

</body>
</html>

Файл config.inc.php подключать обязательно, ведь там находится вызов функции session_start().

Реализуем выход пользователя из системы

Рано или поздно пользователь захочет выйти из нашей системы. Для этого создадим отдельный файл logout.php:

<?php

session_start();
unset($_SESSION['user']);
header("location:index.php");

Тут просто удаляем сессию с ключом `user` и перенаправляем пользователя на главную страницу.

Последние штрихи

Ну, вот в принципе и всё. Что ещё можно добавить? Разве что можем усилить проверки на главной странице и в нескольких if-ах проверять наличие сессии. В общем, смотрите сами, как вам удобнее. Привожу полный код файла index.php:

<?php

require_once 'lib/SocialAuther/autoload.php';
require_once 'config.inc.php';

$adapterConfigs = array(
    'vk' => array(
        'client_id'     => '3774741',
        'client_secret' => '3nLWEs45iWeKypmVR2CU',
        'redirect_uri'  => 'http://localhost/auth/?provider=vk'
    ),
    'odnoklassniki' => array(
        'client_id'     => '168635560',
        'client_secret' => 'C342554C028C0A76605C7C0F',
        'redirect_uri'  => 'http://localhost/auth?provider=odnoklassniki',
        'public_key'    => 'CBADCBMKABABABABA'
    ),
    'mailru' => array(
        'client_id'     => '770076',
        'client_secret' => '5b8f8906167229feccd2a7320dd6e140',
        'redirect_uri'  => 'http://localhost/auth/?provider=mailru'
    ),
    'yandex' => array(
        'client_id'     => 'bfbff04a6cb60395ca05ef38be0a86cf',
        'client_secret' => '219ba8388d6e6af7abe4b4b119cbee48',
        'redirect_uri'  => 'http://localhost/auth/?provider=yandex'
    ),
    'google' => array(
        'client_id'     => '333193735318.apps.googleusercontent.com',
        'client_secret' => 'lZB3aW8gDjIEUG8I6WVcidt5',
        'redirect_uri'  => 'http://localhost/auth?provider=google'
    ),
    'facebook' => array(
        'client_id'     => '613418539539988',
        'client_secret' => '2deab137cc1d254d167720095ac0b386',
        'redirect_uri'  => 'http://localhost/auth?provider=facebook'
    )
);

$adapters = array();
foreach ($adapterConfigs as $adapter => $settings) {
    $class = 'SocialAuther\Adapter\\' . ucfirst($adapter);
    $adapters[$adapter] = new $class($settings);
}

if (isset($_GET['provider']) && array_key_exists($_GET['provider'], $adapters) && !isset($_SESSION['user'])) {
    $auther = new SocialAuther\SocialAuther($adapters[$_GET['provider']]);

if ($auther->authenticate()) {

    $result = mysql_query(
        "SELECT *  FROM `users` WHERE `provider` = '{$auther->getProvider()}' AND `social_id` = '{$auther->getSocialId()}' LIMIT 1"
    );

    $record = mysql_fetch_array($result);
    if (!$record) {
        $values = array(
            $auther->getProvider(),
            $auther->getSocialId(),
            $auther->getName(),
            $auther->getEmail(),
            $auther->getSocialPage(),
            $auther->getSex(),
            date('Y-m-d', strtotime($auther->getBirthday())),
            $auther->getAvatar()
        );

        $query = "INSERT INTO `users` (`provider`, `social_id`, `name`, `email`, `social_page`, `sex`, `birthday`, `avatar`) VALUES ('";
        $query .= implode("', '", $values) . "')";
        $result = mysql_query($query);
    }

        $user = new stdClass();
        $user->provider   = $auther->getProvider();
        $user->socialId   = $auther->getSocialId();
        $user->name       = $auther->getName();
        $user->email      = $auther->getEmail();
        $user->socialPage = $auther->getSocialPage();
        $user->sex        = $auther->getSex();
        $user->birthday   = $auther->getBirthday();
        $user->avatar     = $auther->getAvatar();

        $_SESSION['user'] = $user;
    }

    header("location:index.php");
}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <title></title>
</head>
<body>

<?php
if (isset($_SESSION['user'])) {
    echo '<p><a href="/info.php">Скрытый контент</a></p>';
} else if (!isset($_GET['code']) && !isset($_SESSION['user'])) {
    foreach ($adapters as $title => $adapter) {
        echo '<p><a href="' . $adapter->getAuthUrl() . '">Аутентификация через ' . ucfirst($title) . '</a></p>';
    }
}
?>

</body>
</html>

Итог

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

У меня на этом всё. Удачи вам! И до новых встреч!

Источник: http://feedproxy.google.com/~r/ruseller/CdHX/~3/o_acm9ZnINU/lessons.php

Добавить комментарий

Правила добавления комментариев


Защитный код
Обновить

Download SocComments v1.3