Головні новини
Ви тут: Головна / php / Аутентифікація через ВКонтакте

Аутентифікація через ВКонтакте



З кожним днем ​​вплив соціальних мереж і сервісів тільки міцнішає. Це означає, що нам, як веб розробникам потрібно це враховувати. Сьогодні я розповім і покажу, як створити аутентифікацію ваших користувачів через соціальну мережу Вконтакте. Для цього ми не будемо користуватися якимись сторонніми бібліотеками, а реалізуємо все з нуля, власними руками. Думаю, багато хто чекав подібного уроку.

Крок 1.Реєстрація нового додатка

Для початку нам необхідно створити новий додаток на сайті соціальної мережі ВКонтакте

Для початку нам необхідно створити новий додаток на сайті соціальної мережі ВКонтакте

У формі введіть назву додатка; виберіть тип “Веб-сайт”; В якості адреси сайту введіть адрес вашого сайту, в моєму випадку це http://codice.in.ua/.
Вк авторизація
Після натискання на кнопку “Підключити сайт”, вам напевно доведеться ввести перевірочний код, який прийде по смс. Якщо ви пройдете перевірку, то вам повинна відкритися наступна форма з настройками додатку.
Аутентифікація через ВКонтакте
Я закрив поле “Захищений ключ” тому що це карається видаленням вашого додатка чи облікового запису в цілому.

З даної форми нам знадобляться такі дані, як `ID додатку`, `Захисний ключ`, `Адреса сайту`. Запишемо їх у спеціальні змінні у файлі index.php:

<?php
$client_id = '3555101'; // IDдодатку
$client_secret = 'zakrutovidvsih'; //Захисний ключ
$redirect_uri = 'http://codice.in.ua'; //Адреса сайту

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

$url = 'http://oauth.vk.com/authorize';

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

За допомогою функції http_build_query, передавши туди масив параметрів, отримаємо чергування ключів і значень, як в url адресу. Отже, генеруємо посилання і виводимо на екран:

echo $ link = '<p> <a href = "' . $ url . '?' . urldecode (http_build_query ( $ params )). '"> Вхід через vk </a> </p>' ;

Також тут я скористався функцією urldecode. Якщо цього не зробити, то в згенерованого посилання можуть з’явитися закодовані символи слешів, знаків двокрапки і так далі. Щось на зразок цього:

http://oauth.vk.com/authorize?client_id=3485070&redirect_uri=http%3A%2F%2Fcodice.in.ua%2Fvk-auth&response_type=code

Якщо ж ми пропустимо цей рядок через функцію urldecode, то отримаємо:

http://oauth.vk.com/authorize?client_id=3485070&redirect_uri=http://codice.in.ua/vk-auth&response_type=code

Отже, посилання для аутентифікації у нас готове. Якщо ми сформували всі параметри правильним чином і отримали вірний url, то пройшовши по посиланню, будемо перенаправлені за адресою, вказаною в настройках програми (‘http://codice.in.ua/vk-auth’). Тільки тепер до цієї адреси буде прикріплений спеціальний параметр code:

//Приклад. У вашому випадку код буде інший
http://codice.in.ua/vk-auth/?code=f30621b146115b3bad

Крок 3. Отримання токена

Починати процедуру аутентифікації ми можемо тоді і тільки тоді, коли до нас прийшов параметр code. Він нам потрібен для того, щоб отримати спеціальний токен доступу, за допомогою якого, надалі, ми дістанемо інформацію про користувача.
В першу чергу, знову сформуємо потрібні нам параметри для цього запиту:

if (isset($_GET['code'])) {
    $params = array(
        'client_id' => $>clientId,
        'client_secret' => $this->clientSecret,
        'code' => $_GET['code'],
        'redirect_uri' => $this->redirectUri
    );
}

Далі нам потрібно відправити GET запит на адресу https://oauth.vk.com/access_token, передавши перераховані параметри. У PHP виконати GET запит за якоюсь адресою можна декількома способами. Для даного уроку я скористаюся функцією file_get_contents.

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

    $token = json_decode(file_get_contents('https://oauth.vk.com/access_token' . '?' . urldecode(http_build_query($params))), true);
}

В результаті, при успішному виконанні запиту в змінну $token буде записана відповідь від ВКонтакте в JSON форматі. Даний рядок містить 3 параметри: access_token, який ми будемо використовувати в наступних запитах для вилучення інформації про користувача, expires_in – час життя токена, user_id – id користувача, який пройшов аутентифікацію.

{"access_token":"2c6276b767b5e2f35f908e89d61416beea17b6d1ebcd3d14e20ac910281d306bb506ec78e75518ed614e9","expires_in":86399,"user_id":14966712}

Для того щоб ми далі могли працювати з даними параметрами, декодуємо JSON рядок за допомогою функції json_decode і поміщаємо дані в масив, передавши в якості другого аргументу true.

Крок 4. Отримання інформації про користувача

Отже, тепер коли в нас є параметри access_token і user_id, ми можемо зробити запит до ВКонтакте API і отримати інформацію про користувача. Для початку знову підготуємо масив з параметрами, які надалі перетворимо на фрагмент url рядка.

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

    $token = json_decode(file_get_contents('https://oauth.vk.com/access_token' . '?' . urldecode(http_build_query($params))), true);

    if (isset($token['access_token'])) {
        $params = array(
            'uids'         => $token['user_id'],
            'fields'       => 'uid,first_name,last_name,screen_name,sex,bdate,photo_big',
            'access_token' => $token['access_token']
        );
    }
}

В параметр uids записуємо id користувача; в fields перераховуємо через кому поля, які хочемо витягти (uid – id користувача, first_name – ім’я, last_name – прізвище, screen_name – ім’я відображається на сторінках VK, sex – стать, bdate – дату народження, photo_big – фотографію). Для доступу до більшої кількості полів зверніться до ВКонтакте API users.get. У якості останнього параметра передаємо ‘access_token’.

Для отримання інформації про користувача сфомірованние параметри нам потрібно відправити GET запитом за адресою https://api.vk.com/method/users.get.

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

    $token = json_decode(file_get_contents('https://oauth.vk.com/access_token' . '?' . urldecode(http_build_query($params))), true);

    if (isset($token['access_token'])) {
        $params = array(
            'uids'         => $token['user_id'],
            'fields'       => 'uid,first_name,last_name,screen_name,sex,bdate,photo_big',
            'access_token' => $token['access_token']
        );

        $userInfo = json_decode(file_get_contents('https://api.vk.com/method/users.get' . '?' . urldecode(http_build_query($params))), true);
    }
}

У результаті, якщо все було зроблено правильно, то отримаємо JSON відповідь наступного вигляду:

{"response":[{"uid":14966712,"first_name":"Володимир","last_name":"Гривінський","screen_name":"stanislav.protasevich","sex":2,"bdate":"3.7.1988","photo_big":"http:\/\/cs307601.vk.me\/u14966712\/a_8234a279.jpg"}]}

Знову перетворимо JSON відповідь в масив і звернемося до нульового елементу, котрий зберігається в масиві, доступному по ключу response:

if (isset($_GET['code'])) {
    $result = false;
    $params = array(
        'client_id' => $client_id,
        'client_secret' => $client_secret,
        'code' => $_GET['code'],
        'redirect_uri' => $redirect_uri
    );

    $token = json_decode(file_get_contents('https://oauth.vk.com/access_token' . '?' . urldecode(http_build_query($params))), true);

    if (isset($token['access_token'])) {
        $params = array(
            'uids'         => $token['user_id'],
            'fields'       => 'uid,first_name,last_name,screen_name,sex,bdate,photo_big',
            'access_token' => $token['access_token']
        );

        $userInfo = json_decode(file_get_contents('https://api.vk.com/method/users.get' . '?' . urldecode(http_build_query($params))), true);
        if (isset($userInfo['response'][0]['uid'])) {
            $userInfo = $userInfo['response'][0];
            $result = true;
        }
    }
}

Прошу звернути увагу, що в даному фрагменті, я додав спеціальну змінну $resut, рівну спочатку false відразу ж після перевірки наявності GET параметра code. Якщо нам вдалося витягти інформацію про користувача, то ми міняємо значення цієї змінної на true.
Повний код:

<!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
$client_id = '3555101'; // IDдодатку
$client_secret = 'zakrutovidvsih'; //Захисний ключ
$redirect_uri = 'http://codice.in.ua'; //Адреса сайту

    $url = 'http://oauth.vk.com/authorize';

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

    echo $link = '<p><a href="' . $url . '?' . urldecode(http_build_query($params)) . '">Вхід через vk</a></p>';

if (isset($_GET['code'])) {
    $result = false;
    $params = array(
        'client_id' => $client_id,
        'client_secret' => $client_secret,
        'code' => $_GET['code'],
        'redirect_uri' => $redirect_uri
    );

    $token = json_decode(file_get_contents('https://oauth.vk.com/access_token' . '?' . urldecode(http_build_query($params))), true);

    if (isset($token['access_token'])) {
        $params = array(
            'uids'         => $token['user_id'],
            'fields'       => 'uid,first_name,last_name,screen_name,sex,bdate,photo_big',
            'access_token' => $token['access_token']
        );

        $userInfo = json_decode(file_get_contents('https://api.vk.com/method/users.get' . '?' . urldecode(http_build_query($params))), true);
        if (isset($userInfo['response'][0]['uid'])) {
            $userInfo = $userInfo['response'][0];
            $result = true;
        }
    }

    if ($result) {
        echo " Соціальний ID користувача: " . $userInfo['uid'] . '<br />';
        echo " Ім'я користувача: " . $userInfo['first_name'] . '<br />';
        echo " Посилання на профіль користувача: " . $userInfo['screen_name'] . '<br />';
        echo " Стать користувача: " . $userInfo['sex'] . '<br />';
        echo " День Народження:" . $userInfo['bdate'] . '<br />';
        echo '<img src="' . $userInfo['photo_big'] . '" />'; echo "<br />";
    }
}
?>
</body>
</html>

Крок 5. Витяг інформації про користувача

Тепер витягувати інформацію про користувача ми можемо з масиву, що зберігається в змінній $userInfo по ключах uid, first_name, last_name, screen_name, sex, bdate, photo_big.

if ($result) {
        echo " Соціальний ID користувача: " . $userInfo['uid'] . '<br />';
        echo " Ім'я користувача: " . $userInfo['first_name'] . '<br />';
        echo " Посилання на профіль користувача: " . $userInfo['screen_name'] . '<br />';
        echo " Стать користувача: " . $userInfo['sex'] . '<br />';
        echo " День Народження:" . $userInfo['bdate'] . '<br />';
        echo '<img src="' . $userInfo['photo_big'] . '" />'; echo "<br />";
    }

Крок 6. Справа за вами

Тепер, коли у нас є така інформація, як ID користувача, в першу чергу, нам необхідно перевірити його наявність в нашій базі даних. Якщо користувача з таким ID не існує, то значить він авторизувався з нашого сайту вперше, і ми внесемо його в базу. Якщо користувач вже є, можемо перевірити чи не змінилися якісь дані про нього, наприклад, ім’я або ще щось. Якщо так, оновимо запис.

Після цього, все що нам залишилося зробити, так це створити сесію і помістити в неї інформацію про нашого користувача.

$_SESSION['user'] = $userInfo;

На сторінці виходу з системи просто видаляємо сесію за допомогою функції unset.

Підсумок

Ось ми і підійшли до кінця даного уроку, і тепер у ваших руках є рішення, якого ви, можливо, довго чекали. Якщо вас цікавить тема аутентифікації через соціальні мережі, то пишіть про це в коментарях, і я з радістю розповім і покажу, як працювати з Однокласниками, Google-ом, Facebook-ом і іншими сервісами.

Джерело: ruseller.com



Автор Володимир Гривінський



Залишити коментар

Ваша електронна адреса не буде опублікована.

Вгору
UA TOP Bloggers