http://dutlaiganhole.ru/

Аутентификация через Facebook

Аутентификация через Facebook

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

Сегодня рассмотрим процесс аутентификации через социальную сеть Facebook. Для этого мы не будет использовать не библиотек, не плагинов, а сделаем всё с нуля.

Шаг 1. Регистрация нового приложения

Для того, чтобы зарегистрировать новое приложение,  надо пройти на специальную страницу.
Нажимаем кнопку «+ Создать новое приложение». И вписываем наше название, в данном примере это будет Auth Test:

auth

Затем вводим проверочный код:

captcha

Далее, на странице настроек, в блоке «Как ваше приложение встроено в Facebook» кликаем на пункт «Website with Facebook Login». В открывшемся поле вводим адрес нашего сайта. В моём случае, это /facebook-auth:

apps

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

app id

Можно их сразу записать в специальные переменные в файле index.php

$client_id = '578516362116657'; // Client ID
$client_secret = 'eb1814bd3980ab9a306dc35073021fb3'; // Client secret
$redirect_uri = '/facebook-auth'; // Redirect URIs

Шаг 2. Генерируем ссылку для нашей аутентификации

Для этого нам потребуется адрес аутентификации и специальные параметры:

$url = 'https://www.facebook.com/dialog/oauth';

$params = array(
    'client_id'     => $client_id,
    'redirect_uri'  => $redirect_uri,
    'response_type' => 'code',
    'scope'         => 'email,user_birthday'
);

С помощью функции http_build_query, передаём туда массив параметров и полаем чередование ключей и значений, как в url адресе. Итак, генерируем ссылку и выводим на экран:

echo $link = '

Аутентификация через Facebook

'; // https://www.facebook.com/dialog/oauth?client_id=578516362116657&redirect_uri=/facebook-auth&response_type=code&scope=email,user_birthday

Итак, наша ссылка готово. Если мы всё сделали правильно и получили верный URL, то после перехода по ссылке, мы будем перенаправлены по адресу, указанному в настройках, т.е. (‘/facebook-auth’).
Только теперь к нему будет прикреплен специальный параметр code:

// Пример. В вашем случае код будет другой

/facebook-auth/?code=AQD5q80zafjvVZoZex87ROxkCvWT9rZhjwZtkBLajYwH20KztPOI0jpb5lHZisPd3mA49Wu_onAeEioU5K6KVuoCliznf61B5bDfZSLFaIn6E7E49zqs4fO6NjTYyxN43LBttCvsSlirJOAtbOpB3oyMrl3bbjlPhGHsCyJzA-DypEIZ1c_36WAEBPmfSq3TroekvTLme3jIzZk0C-93cu8z#_=_

Шаг 3. Получаем токен

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

В первую очередь, снова сформируем параметры для этого запроса. Нам потребуется передать параметры: `client_id` — id приложения; `redirect_uri` — страница, на которую будет возвращён пользователь; `client_secret` — секретный ключ; `code` — url параметр, пришедший от Facebook:

if (isset($_GET['code'])) {
    $result = false;

    $params = array(
        'client_id'     => $client_id,
        'redirect_uri'  => $redirect_uri,
        'client_secret' => $client_secret,
        'code'          => $_GET['code']
    );

    $url = 'https://graph.facebook.com/oauth/access_token';
}

Далее нам нужно на адрес https://graph.facebook.com/oauth/access_token, отправить запрос GET, передав перечисленные параметры. В PHP выполнить запрос GET можно несколькими способами но я воспользуюсь функцией file_get_contents. Facebook в отличии от других социальных сетей присылает ответ не в JSON формате, а в виде строки, где все параметры разделяются специальными символами. Нам нужно распарсить данный ответ, для этого используем функцию parse_str, а результат запишем в переменную $tokenInfo:

$tokenInfo = null;
parse_str(file_get_contents($url . '?' . http_build_query($params)), $tokenInfo);

В результате в переменную $tokenInfo будет записан ответ в формате JSON.
Данная строка содержит 4 параметра: access_token, который мы будем использовать в следующих запросах для извлечения информации о пользователе; token_type — тип токена; expires_in — время жизни токена; id_token — id токена:

array(2) {
  ["access_token"]=>
  string(115) "AAAIOREZCDAnUBAOEmLbNqgHzQSNFoZBBdZC99eNv6DkZA842GUTHP3H7j7YnxEPOZCmZBiPgEZCJCb80zVXDGP9JeX8DGSRi6PU2liZAPQuj9QZDZD"
  ["expires"]=>
  string(7) "5177324"
}

Шаг 4. Получаем информацию о пользователе

Для получения информации о пользователе, делаем запрос к Facebook API и передаем параметр access_token:

if (count($tokenInfo) > 0 && isset($tokenInfo['access_token'])) {
        $params = array('access_token' => $tokenInfo['access_token']);

        $userInfo = json_decode(file_get_contents('https://graph.facebook.com/me' . '?' . urldecode(http_build_query($params))), true);
        if (isset($userInfo['id'])) {
            $userInfo = $userInfo;
            $result = true;
        }
    }

Отправляем GET запрос по адресу https://graph.facebook.com/me и получаем JSON ответ примерно такого вида:

Array
(
    [id] => 100000317390816
    [name] => Стас Протасевич
    [first_name] => Стас
    [last_name] => Протасевич
    [birthday] => 07/03/1988
    [hometown] => Array
        (
            [id] => 110228142339670
            [name] => Chisinau, Moldova
        )

    [location] => Array
        (
            [id] => 110228142339670
            [name] => Chisinau, Moldova
        )

    [work] => Array
        (
            [0] => Array
                (
                    [employer] => Array
                        (
                            [id] => 159295210819421
                            [name] => Web-Concept
                        )

                    [location] => Array
                        (
                            [id] => 110228142339670
                            [name] => Chisinau, Moldova
                        )

                    [position] => Array
                        (
                            [id] => 108480125843293
                            [name] => Web Developer
                        )

                    [start_date] => 2010-09
                    [end_date] => 2011-10
                )

        )

    [sports] => Array
        (
            [0] => Array
                (
                    [id] => 106011416097502
                    [name] => Ice hockey
                )

        )

    [favorite_athletes] => Array
        (
            [0] => Array
                (
                    [id] => 202766356426583
                    [name] => Michael Jordan
                )

        )

    [inspirational_people] => Array
        (
            [0] => Array
                (
                    [id] => 7170054127
                    [name] => Hans Zimmer
                )

            [1] => Array
                (
                    [id] => 113529011990795
                    [name] => Steve Jobs
                )

            [2] => Array
                (
                    [id] => 225471537469600
                    [name] => Albert Einstein
                )
        )

    [education] => Array
        (
            [0] => Array
                (
                    [school] => Array
                        (
                            [id] => 135979339750670
                            [name] => Лицей Василия Лупу
                        )

                    [year] => Array
                        (
                            [id] => 140617569303679
                            [name] => 2007
                        )

                    [type] => High School
                )

            [1] => Array
                (
                    [school] => Array
                        (
                            [id] => 110260779004118
                            [name] => State University of Moldova
                        )

                    [year] => Array
                        (
                            [id] => 142963519060927
                            [name] => 2010
                        )

                    [concentration] => Array
                        (
                            [0] => Array
                                (
                                    [id] => 189014467787633
                                    [name] => Прикладная информатика
                                )

                        )

                    [type] => College
                )

            [2] => Array
                (
                    [school] => Array
                        (
                            [id] => 110260779004118
                            [name] => State University of Moldova
                        )

                    [degree] => Array
                        (
                            [id] => 200940416612694
                            [name] => Магистр
                        )

                    [year] => Array
                        (
                            [id] => 115222815248992
                            [name] => 2012
                        )

                    [concentration] => Array
                        (
                            [0] => Array
                                (
                                    [id] => 120214931322280
                                    [name] => сетевые технологии
                                )

                        )

                    [type] => Graduate School
                )

        )

    [gender] => male
    [email] => stanislav.protasevich@gmail.com
    [timezone] => 2
    [locale] => ru_RU
    [languages] => Array
        (
            [0] => Array
                (
                    [id] => 176015189120060
                    [name] => Russian
                )

            [1] => Array
                (
                    [id] => 106059522759137
                    [name] => English
                )

        )

    [verified] => 1
    [updated_time] => 2012-12-06T18:06:38+0000
)

Полный код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="/1999/xhtml" xml:lang="ru">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
    <title>Аутентификация через Facebook</title>
</head>
<body>

<?php

$client_id = '578516362116657'; // Client ID
$client_secret = 'eb1814bd3980ab9a306dc35073021fb3'; // Client secret
$redirect_uri = '/facebook-auth'; // Redirect URIs

$url = 'https://www.facebook.com/dialog/oauth';

$params = array(
    'client_id'     => $client_id,
    'redirect_uri'  => $redirect_uri,
    'response_type' => 'code',
    'scope'         => 'email,user_birthday'
);

echo $link = '<p><a href="' . $url . '?' . urldecode(http_build_query($params)) . '">Аутентификация через Facebook</a></p>';

if (isset($_GET['code'])) {
    $result = false;

    $params = array(
        'client_id'     => $client_id,
        'redirect_uri'  => $redirect_uri,
        'client_secret' => $client_secret,
        'code'          => $_GET['code']
    );

    $url = 'https://graph.facebook.com/oauth/access_token';

    $tokenInfo = null;
    parse_str(file_get_contents($url . '?' . http_build_query($params)), $tokenInfo);

    if (count($tokenInfo) > 0 && isset($tokenInfo['access_token'])) {
        $params = array('access_token' => $tokenInfo['access_token']);

        $userInfo = json_decode(file_get_contents('https://graph.facebook.com/me' . '?' . urldecode(http_build_query($params))), true);

        if (isset($userInfo['id'])) {
            $userInfo = $userInfo;
            $result = true;
        }
    }
}
?>

</body>
</html>

Шаг 5. Извлекаем информацию о пользователе

Для просмотра большего количества полей загляните в содержание переменной $userInfo:

if ($result) {
        echo "Социальный ID пользователя: " . $userInfo['id'] . '
'; echo "Имя пользователя: " . $userInfo['name'] . '
'; echo "Email: " . $userInfo['email'] . '
'; echo "Ссылка на профиль пользователя: " . $userInfo['link'] . '
'; echo "Пол пользователя: " . $userInfo['gender'] . '
'; echo "ДР: " . $userInfo['birthday'] . '
'; echo ''; echo "
"; }

Шаг 6. Дальнейшие шаги

После этого всё, что нам осталось сделать, так это создать сессию и поместить в неё информацию о нашем пользователе.

$_SESSION['user'] = $userInfo;

На странице выхода из системы просто удаляем сессию с помощью функции и unset.

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

comments powered by Disqus
Subscribe to RSS Feed Следить в Twitter