• 1450
  • 0
  • Обсудить нана форуме
  • Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки
  • Демо:

Альтернатива auth_loginza. Работает без открытия доп. окон, но для работы требуется регистрация приложений в соц. сетях.
Плагин не является самостоятельным модулем авторизации, а работает лишь, как дополнение к одному из уже работающих плагинов, например auth_basic. В данный момент поддерживается авторизация через vk, odnoklassniki, mailru, yandex, google, facebook
Установка
1. Зарегистрировать приложения в соц.сетях, по инструкции:
Аутентификация через ВКонтакте
Внимание! Если при переходе по ссылке авторизации, которую генериует метод $vkAdapter->getAuthUrl(), в качестве ответа выводится сооб щение {"error":"invalid_request","error_description":"Security Error"}, то вам необходимо отправиться на страницу настроек вашего vk аккаунта. В разделе "Безопасность Вашей страницы" нажмите ссылку "Посмотреть историю активности". В открывшемся окне нажмите "Завершить все сеансы", для очистки vk кэша. Таким образом, возникшая проблема security_error будет устранена.
Для осуществления аутентификации через социальную сеть ВКонтакте вам необходимо предварительно создать новый проект и сконфигурировать параметры: client_id, client_secret и redirect_uri:
Шаг 1. Создание нового приложения:
название: "SocialAuther Test"
тип: "Веб-сайт"
Шаг 2. Настройка секции "Open API":
адрес сайта: http://sitename.ru/plugin/auth_social/?provider=vk
базовый домен: "sitename.ru"
Шаг 3. Конфигурация параметров client_id, client_secret и redirect_uri:
client_id - содержится в опции "ID приложения".
Пример: 3078654
client_secret - содержится в опции "Защищенный ключ".
Пример: zrCHcmKAcBvblSUIBIwu
redirect_uri - содержится в опции "Адрес сайта" - http://sitename.ru/plugin/auth_social/?provider=vk

Аутентификация через Одноклассники
Для осуществления аутентификации через социальную сеть Одноклассники вам необходимо предварительно создать новый проект и сконфигурировать параметры: client_id, client_secret, redirect_uri, public_key:
Шаг 1. Создание нового приложения:
Шаг 2. Настройка приложения:
название: "SocialAuther Test"
shortname: SocialAuther_Test
ссылка на приложение: http://sitename.ru/plugin/auth_social/?provider=odnoklassniki
"Ссылка на картинку" и "Ссылка на аватарку": ссылка на любое изображение
redirect_uri - ссылка на приложение.
Пример: http://sitename.ru/plugin/auth_social/?provider=odnoklassniki
Шаг 3. Конфигурация параметров client_id, client_secret, redirect_uri, public_key. Всю нужную информацию вы найдёте в письме, которое было отправлено на вашу электронную почту после успешного добавления приложения:
client_id - Application ID. Пример: 658606315
client_secret - секретный ключ приложения. Пример: C35045020A8C7C066F25C4C7
public_key - публичный ключ приложения. Пример: BAMKABABACADCBBAB

Аутентификация через Mail.ru
Шаг 1. Создание нового приложения:
соглашаемся с правилами
название: "SocialAuther Test"
адрес главной страницы: http://sitename.ru/plugin/auth_social/?provider=mailru
Шаг 2. Настройка приложения:
скачиваем предложенный файл receiver.html и помещаем в папку проекта
для установки на локальный сервер, нажимаем "Пропустить"
Шаг 3. Конфигурация параметров client_id, client_secret, redirect_uri:
client_id - ID.
Пример: 670707
client_secret - секретный ключ.
Пример: a619062972f2073ded61405b8f8eccd2
redirect_uri - адрес главной страницы.
Пример: http://sitename.ru/plugin/auth_social/?provider=mailru

Аутентификация через Yandex
Шаг 1. Создание нового приложения:
Шаг 2. Настройка приложения:
Название: "SocialAuther Test"
Права: "Яндекс.Логин - Адрес электронной почты; Дата рождения; Имя пользователя, ФИО, пол"
Callback URI: http://sitename.ru/plugin/auth_social/?provider=yandex
Шаг 3. Конфигурация параметров client_id, client_secret, redirect_uri:
client_id - Id приложения.
Пример: bff0bfcaef054ab66c0538b39e0a86cf
client_secret - Пароль приложения.
Пример: 219ba88d386b114b9c6abef7eab4e8e4
redirect_uri - Callback URI.
Пример: http://sitename.ru/plugin/auth_social/?provider=yandex

Аутентификация через Google
Шаг 1. Создание нового приложения:
в меню выбираем "Enable and manage APIs"
нажимаем на кнопку "Credentials"
там появляется окошко в окошке жмем New Credentials
В списке выбираем OAuth client ID
далее появляется

Цитата:
To create an OAuth client ID, you must first set a product name on the consent screen
Configure consent screen
жмем Configure consent screen
Шаг 2. Настройка приложения:
API Access: "SocialAuther Test"
Нажимаем Next
Application Type: "Web application"
Your site or hostname: localhost/google-auth
Нажимаем Create client ID
Шаг 3. Конфигурация параметров client_id, client_secret, redirect_uri:
client_id - Id приложения.
Пример: 333739311538.apps.googleusercontent.com
client_secret - Пароль приложения.
Пример: lZB3aW8UG8gDj6WVIEIcidt5
redirect_uri - Callback URI.
Пример: https://ngcmshak.ru/plugin/auth_social/?provider=google

Аутентификация через Facebook
Шаг 1. Создание нового приложения:
Нажимаем на кнопку "+ Создать новое приложение"
App Name: "SocialAuther Test"
Нажимаем "Продолжить"
Шаг 2. Настройка приложения:
Нажимаем "Website with Facebook Login"
Вводим Site URL: http://sitename.ru/plugin/auth_social/?provider=facebook
Шаг 3. Конфигурация параметров client_id, client_secret, redirect_uri:
client_id - App ID.
Пример: 346158195993388
client_secret - App Secret.
Пример: 2de1ab376d1c17cd47250920c05ab386
redirect_uri - Callback URI.
Пример: http://sitename.ru/plugin/auth_social/?provider=facebook

Аутентификация через Twitter
Шаг 1. Создание нового приложения:
Name: "SocialAuther Test"
Description: "SocialAuther Test Description"
Website: "http://sitename.ru"
Callback URL: "http://sitename.ru"

Шаг 2. Конфигурация параметров client_id, client_secret и redirect_uri:
client_id - API key.
Пример: ef054ab66c0538b39e0a865cf
client_secret - API secret.
Пример: 6d6c0538b39e0a86cf219ba88d386b114b9c6abef7eab4e8e4
redirect_uri - Callback URL.
Пример: http://sitename.ru/auth?provider=twitter

Аутентификация через steam
Шаг 1. Создание нового приложения:
Шаг 2. Конфигурация параметров client_id, client_secret и redirect_uri:
Добавляем свой домен
пример :ngcms.info
жмём зарегистрировать и получаем API key
копируем API key.
Пример: ef054ab66c0538b39e0a865cf
Добавляем API key в плагин .

В параметре redirect_uri везде писать, следующие URL'ы:
Код:
http://sitename.ru/plugin/auth_social/?provider=vk
http://sitename.ru/plugin/auth_social/?provider=odnoklassniki
http://sitename.ru/plugin/auth_social/?provider=mailru
http://sitename.ru/plugin/auth_social/?provider=yandex
http://sitename.ru/plugin/auth_social/?provider=google
http://sitename.ru/plugin/auth_social/?provider=facebook
http://sitename.ru/plugin/auth_social/?provider=twitter
http://sitename.ru/plugin/auth_social/?provider=steam

2. Включить плагин. В настройках плагина, внести данные о приложениях в соц.сетях (client_id, client_secret, public_key)

3. В шаблоне usermenu.tpl прописать ссылки по которым будет осуществляться авторизация, например:
Код:
<a href="{{p.auth_social.vk.authUrl}}">{{p.auth_social.vk.title}}</a>
<a href="{{p.auth_social.odnoklassniki.authUrl}}">{{p.auth_social.odnoklassniki.title}}</a>
<a href="{{p.auth_social.mailru.authUrl}}">{{p.auth_social.mailru.title}}</a>
<a href="{{p.auth_social.yandex.authUrl}}">{{p.auth_social.yandex.title}}</a>
<a href="{{p.auth_social.google.authUrl}}">{{p.auth_social.google.title}}</a>
<a href="{{p.auth_social.facebook.authUrl}}">{{p.auth_social.facebook.title}}</a>
<a href="{{p.auth_social.twitter.authUrl}}">{{p.auth_social.twitter.title}}</a>
<a href="{{p.auth_social.steam.authUrl}}">{{p.auth_social.steam.title}}</a>

Интеграция с профилем (плагин uprofile)
При установке плагина в таблице users создаются новые поля: provider, social_id, social_page, sex, birthday
Данные в данных полях слабоструктурированы и могут либо вообще отсутствовать, либо их вид может различаться в зависимости от соц. сети.

1. \templates\ваш_шаблон\plugins\uprofile\users.tpl

Код:
{{ userRec.provider }} - тип. соц. сети.
{{ userRec.social_page }} - ссылка на профиль с социальной сети.
{{ userRec.sex }} - пол пользователя.
{{ userRec.birthday }} - дата рождения пользователя.

Пример вывода:
Код:
{% if (userRec.provider) and (userRec.social_page) %}
<tr>
<td>Профиль соцсети:</td>
<td class="second">{{ userRec.social_page }}</td>
</tr>
{% endif %}
{% if (userRec.provider) and (userRec.sex) %}
<tr>
<td>Пол:</td>
<td class="second">{{ userRec.sex }}</td>
</tr>
{% endif %}
{% if (userRec.provider) and (userRec.birthday) %}
<tr>
<td>Дата рождения:</td>
<td class="second">{{ userRec.birthday }}</td>
</tr>
{% endif %}

2. \templates\ваш_шаблон\plugins\uprofile\profile.tpl

Код:
{{ userRec.sex }} - пол пользователя.
{{ userRec.birthday }} - дата рождения пользователя.

Пример вывода:
Код:
<div class="label label-table">
<label>Пол:</label>
<input type="text" name="editsex" value="{{ userRec.sex }}" class="input" />
</div>
<div class="label label-table">
<label>Дата рождения:</label>
<input type="text" name="editbirthday" value="{{ userRec.birthday }}" class="input" />
</div>

Можешь почитать и вот эту статейку "Анимированный прогресс бар для вашего сайта"

mistakes

Это тоже интересно

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

Ваше мнение

Вы нашли что искали?
Результаты

----