Сегодня никто не хочет заполнять длинные формы регистрации. Кнопка «Войти через Google» увеличивает конверсию в разы. Если вы пишете на Yii2, у вас есть несколько путей добавить такую возможность. В этой статье я расскажу, как быстро и без боли прикрутить социальную аутентификацию к вашему проекту.

Digital-студия WNDER

Зачем вообще нужна соц-аутентификация

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

Но есть нюанс: каждый провайдер (Google, Facebook, VK) имеет свои причуды. Нужно правильно настроить OAuth, обработать ответ, создать пользователя в своей базе. В Yii2 это делается элегантно с помощью расширений.

Выбираем инструмент: обзор расширений

Для Yii2 есть несколько популярных пакетов. Я рекомендую yii2-authclient — официальное расширение от команды Yii. Оно поддерживает кучу провайдеров из коробки: Google, Facebook, Twitter, VK, GitHub и другие. Альтернативы вроде dektrium/yii2-user тоже умеют, но часто требуют больше телодвижений.

Сравним основные варианты:

Расширение Плюсы Минусы
yii2-authclient Официальное, много провайдеров, гибкое Нужно писать свою логику сохранения пользователя
dektrium/yii2-user Готовый модуль с регистрацией, восстановлением пароля Избыточно, если нужен только соц-вход
nodge/yii2-eauth Много провайдеров, простая настройка Реже обновляется

Мой выбор — yii2-authclient. Дальше покажу, как его готовить.

Установка и настройка yii2-authclient

Ставим через Composer:

composer require yiisoft/yii2-authclient

Теперь нужно настроить компонент в конфиге приложения (обычно config/web.php). Добавим в массив components:

'authClientCollection' => [
    'class' => 'yii\authclient\Collection',
    'clients' => [
        'google' => [
            'class' => 'yii\authclient\clients\Google',
            'clientId' => 'ВАШ_CLIENT_ID',
            'clientSecret' => 'ВАШ_CLIENT_SECRET',
        ],
        'facebook' => [
            'class' => 'yii\authclient\clients\Facebook',
            'clientId' => 'ВАШ_CLIENT_ID',
            'clientSecret' => 'ВАШ_CLIENT_SECRET',
        ],
    ],
],

Где взять clientId и clientSecret? Идём в консоль разработчика Google (console.cloud.google.com) или Facebook for Developers, создаём приложение, получаем ключи. Не забудьте указать redirect URI — это адрес, куда провайдер вернёт пользователя после авторизации. Обычно это https://ваш-сайт/auth?authclient=google.

Правило: Всегда проверяйте, что redirect URI в настройках провайдера точно совпадает с тем, что генерирует Yii. Одна лишняя косая черта — и вы получите ошибку redirect_uri_mismatch.

Пишем код аутентификации

Теперь создадим контроллер, который будет обрабатывать вход. Назовём его AuthController. В нём будет действие actionAuth, которое принимает параметр authclient (например, google).

namespace app\controllers;

use Yii;
use yii\web\Controller;
use yii\authclient\AuthAction;

class AuthController extends Controller
{
    public function actions()
    {
        return [
            'auth' => [
                'class' => AuthAction::class,
                'successCallback' => [$this, 'onAuthSuccess'],
            ],
        ];
    }

    public function onAuthSuccess($client)
    {
        $attributes = $client->getUserAttributes();
        // Здесь обрабатываем данные пользователя
        // Например, ищем или создаём пользователя в БД
        $email = $attributes['email'] ?? null;
        if (!$email) {
            Yii::$app->session->setFlash('error', 'Не удалось получить email');
            return $this->redirect(['site/login']);
        }

        $user = User::find()->where(['email' => $email])->one();
        if (!$user) {
            $user = new User();
            $user->email = $email;
            $user->username = $attributes['name'] ?? $email;
            $user->setPassword(Yii::$app->security->generateRandomString());
            $user->generateAuthKey();
            $user->save();
        }

        Yii::$app->user->login($user, 3600*24*30);
        return $this->redirect(['site/index']);
    }
}

Разберём, что тут происходит. Метод onAuthSuccess вызывается после успешной авторизации у провайдера. Мы получаем атрибуты пользователя (email, имя). Дальше ищем пользователя по email. Если нет — создаём нового, генерируем случайный пароль (он всё равно не понадобится, вход через соцсеть). Затем логиним и перенаправляем на главную.

Не забудьте в модели User реализовать интерфейс IdentityInterface и добавить методы findIdentity, findIdentityByAccessToken, validateAuthKey и т.д. Если вы используете стандартный шаблон Yii2, там уже есть класс User — просто дополните его.

Добавляем кнопки в представление

Осталось вывести кнопки «Войти через Google» и «Войти через Facebook» на странице логина. В Yii2 есть удобный виджет AuthChoice.

use yii\authclient\widgets\AuthChoice;

echo AuthChoice::widget([
    'baseAuthUrl' => ['auth/auth'],
    'popupMode' => false, // true, если хотите всплывающее окно
]);

Этот виджет сгенерирует HTML-код с кнопками. По умолчанию он использует иконки, но вы можете переопределить шаблон. Кстати, если не хотите иконок, можно просто вывести ссылки вручную:

Войти через Google
Войти через Facebook

Всё просто. После клика пользователь уйдёт на страницу провайдера, разрешит доступ, и вернётся на ваш сайт уже залогиненным.

Обработка ошибок и подводные камни

Даже с таким простым подходом бывают грабли. Вот основные:

  • Пользователь запретил доступ к email. Некоторые провайдеры (например, Facebook) могут не отдать email, если пользователь не подтвердил его. Всегда проверяйте наличие email в атрибутах.
  • Ошибка redirect_uri_mismatch. Убедитесь, что в настройках приложения указан точный URL. Для локальной разработки используйте http://localhost/auth?authclient=google.
  • Конфликт с существующей учёткой. Если пользователь уже регистрировался через email, а потом вошёл через Google с тем же email, нужно связать аккаунты. Иначе создастся дубликат.
Лайфхак: Создайте отдельную таблицу auth для хранения связей user_id — provider — provider_user_id. Это позволит одному пользователю иметь несколько способов входа.

Ещё один момент: после успешного входа провайдер может вернуть не все данные, которые вы ожидаете. Например, Google отдаёт email, имя, аватар. Facebook — email, имя, но аватар нужно запрашивать отдельно. Внимательно читайте документацию провайдера.

Что в итоге

Социальная аутентификация в Yii2 — это не ракетная наука. С расширением yii2-authclient вы за полчаса добавите вход через Google, Facebook, VK и другие. Главное — правильно настроить редиректы и не забыть обработать ошибки. Пользователи скажут спасибо, а вы получите больше регистраций.

Попробуйте, экспериментируйте. Если что-то не получается — читайте логи, смотрите, какие данные приходят от провайдера. Удачи!

Студия WNDER