Дополнение HybridAuth, можно скачать с репозитория modstore.
Данный компонент хорош тем, что у него:
- Много сервисов авторизации (вернее есть все самые популярные).
- Нет зависимости от других компонентов и сервисов. Если к примеру один или несколько сервисов перестали работать (поменялись к примеру алгоритмы или просто отключены) — то всегда можно зайти через другой.
- Нет сторонних js библиотек — работает на чистом php, отсюда — есть возможность изменения внешнего вида формы входа.
- Привязывает разные учетные записи юзера к одной, а не плодит кучу.
- Есть возможность сделать регистрацию через другой компонент, например через Login.
- Поддерживает pdoTools (пожалуй самый популярный и ходовой инструмент), и синтаксис Fenom.
- Автоматически интегрируется с пакетом Office (личный кабинет).
- Простота использования — нужно только получить ключи у нужных провайдеров и прописать их в настройках.
Регистрация у провайдеров и получение ключей
Примечание! Вот так пишутся Callback URI https://site.ru/?hauth.done=Провайдер , например https://site.ru/?hauth.done=Yandex иногда вот так: https://site.ru/assets/components/hybridauth/action.php?hauth.done=Yandex
Регистрация приложений
Яндекс
- Переходим по ссылке
- Заполняем поля Название, Описание, Ссылка на сайт, Платформа — ставим Веб-сервисы, Callback URI и Права
После сохранения, копируем Id и Пароль.
Вконтакте
- Переходим по ссылке
- Пишем название, выбираем опцию Веб-сайт и заполняем Адрес сайта и Базовый домен
- Нажимаем подключить сайт, после этого переходим в настройки и копируем ID приложения и Защищенный ключ
Гугл
- Переходим по ссылке
- Нажимаем создать проект.
- Указываем название проекта и создаем его.
- Переходим в переходим в панель управления API и сервисы и нажимаем включить API (вверху должен быть указан ранее созданный проект)
- Находим и включаем Contacts API и Google+ API
- Переходим в API и сервисы → Учетные данные и добавляете их
в поле Какой API вы используете, выбираем Contacts API
Откуда будите вызывать API выбираете Веб-браузер (JavaScript)
После нажатия на выбрать тип учетных данных пользователя (Данные пользователя), должно выйти окошко с надписью создать запрос доступа, соглашаетесь и на открывшейся странице заполняем все данные и сохраняете.
- создаем Oauth клиента и копируем их ключи
В общем не все скриншоты сделал и пару пунктов пропустил, может в следующий раз дополню, а пока тыкаем пока не получится в общем.
Github
- Переходим по ссылке
- Заполняем поля Application name, Homepage URL и Authorization callback URL
- Сохраняем приложение и копируем Client ID и Client Secret
- Переходим по ссылке
- Нажимаем добавить новый ID приложения, заполняем и создаем.
- Вас перебросит в панель управления приложения, слева выбираете настройки — основные, проматываем в низ и нажимаем на кнопку Добавить платформу — Веб-сайт, вводим адрес и сохраняем.
- Снова проматываем вверх, заполняем адрес сайта и адрес страницы с политикой конфиденциальности (нужно создать на сайте — можно пустую) и включаем приложение.
- Сохраняем Идентификатор и секрет приложения
Всех основных провайдеров рассмотрели, но можно добавить дополнительных: официальные инструкции по подключению провайдеров лежат здесь, информация там немного устарела, но при желании разберетесь, единственно изменилась ссылка у твиттера на apps.twitter.com .
Настройки провайдеров
Идем в системные настройки (шестеренка в правом верхнем углу), выбираем HybridAuth
и прописываем все ключи, при прописывании смотрите внимательнее, так как где то secret, где, то id.
Вызов HybridAuth
[[!HybridAuth]] — Выведет все иконки соц сетей для авторизации.
Если вам нужны определенные соц сети, то их можно указать в параметре &providers, вот так.
[[!HybridAuth? &providers=`Twitter,Vkontakte,Google` ]]
Важно. Так же желательно указать группу, куда попадает пользователь после авторизации, в противном случае он попадет в группу аноним (не сможет не чего делать на сайте). Для того чтобы пользователь попал в другую группу, нужно добавить параметр &groups, пример.
[[!HybridAuth? &providers=`Twitter,Vkontakte,Google` &groups=`member:3` ]]
Как создать группу для пользователей на примере тикета, я писал здесь. В следующем уроке разберем как формировать дату и время.
Привет как добавит другой провайдер!
Создать новый параметр настроек и получить ключи.