Хочу сделать авторизацию/регистрацию через ВКонтакте, нашел официальную библиотеку. Хотелось бы посмотреть пример такой авторизации, или как вариант пример с авторизацией через ulogin, со всеми вьюхами, контроллером, моделью. Так же. Где это можно посмотреть?
2 ответа
Большую часть работы потребуется выполнить на фронтенде.
Библиотека ulogin
<script type="text/javascript" src="//ulogin.ru/js/ulogin.js"></script>
Блок авторизации через соц. сети на странице.
<div class="social_block">
<!-- fields - это список полей которые вам нужны(имя, фамилия, email, телефон). Они будут отоброжатся средствами ulogin при регистрации. -->
<!-- callback - это js функция которая будет вызвана после нажатия кнопки "продожить" в форме ulogin. В нашем случаи будет вызыватся get_ulogin-->
<!-- redirect_uri - оставляем пустым -->
<div id="uLogin1" x-ulogin-params="display=buttons;fields=first_name,last_name,email,phone;providers=vkontakte,odnoklassniki,mailru,facebook;callback=get_ulogin;redirect_uri=">
<span data-uloginbutton="facebook"></span>
<span data-uloginbutton="vkontakte"></span>
<span data-uloginbutton="odnoklassniki"></span>
<span data-uloginbutton="mailru"></span>
<span data-uloginbutton="yandex"></span>
</div>
</div>
Скрытая форма для данных
<form name="ulogin_form" method="POST" action="user/ulogin" style="display:none">
<input type="text" name="email" id="ulogin_email">
<input type="text" name="phone" id="ulogin_phone">
<input type="text" name="name" id="ulogin_name">
<input type="text" name="sename" id="ulogin_sename">
<input type="text" name="password" id="ulogin_password">
</form>
callback функция
<script type="text/javascript">
/*Эта функция будет вызыватся после нажатия кнопки "продолжить". В функцию будет передан токен*/
function get_ulogin(token)
{
//отправлям ajax запрос для получения данных о пользователе
$.ajax({
url: 'http://ulogin.ru/token.php',
type: 'GET',
dataType:'jsonp',
async: false,
//Передаем токен и свой адрес сайта. Адрес сайта по моему можно даже оставить пустым
data: {'token': token, 'host': '<?= Yii::$app->request->getServerName() ?>'},
success: function (data)
{
console.log(data);
//Получеными данными о пользователе, заполняем скрытую форму
var user_data = $.parseJSON(data);
$("#ulogin_email").val(user_data.email);
$("#ulogin_phone").val(user_data.phone);
$("#ulogin_name").val(user_data.first_name);
$("#ulogin_sename").val(user_data.last_name);
$("#ulogin_password").val(user_data.uid);
//Отправляем форму с данными к себе на сервер
document.ulogin_form.submit();
}
});
}
</script>
На бэкенде нужно будет выполнить валидацию днных из формы и выполнить проверку существованиея пользователя. Если пользователь с таким email не существует то выполняем регистрацию. Если пользователь с таким email существует и пароль подходит то выполняем авторизацию. Если пользователь с таким email существует и пароль не подходит то показываем сообщение об ошибке.
<?php
namespace app\controllers;
use Yii;
use app\models\Ulogin;
class UserController extends Controller
{
/* Акшен для регистрация через ulogin */
public function actionUlogin()
{
$user = new Ulogin();
if ( $user->load(Yii::$app->request->post(),'') && $user->validate() ) {
if ($user->uLogin()) {
return $this->redirect('/');
}
}
}
}
Модель
<?php
namespace app\models;
use Yii;
use yii\base\Model;
class Ulogin extends Model
{
public $name;
public $sename;
public $email;
public $password;
public $phone;
public function uLogin()
{
$user = User::findByEmail($this->email);
//Если пользователь с такой эл. почтой сущесвует то выполняем авторизацию
if ($user) {
//Здесь будет авторизация
} else {
//Здесь будет регистрация
}
}
}
Довольно неплохой пример использования, от самих же разработчиков, можно найти здесь.
Добавление действия в контроллере:
use app\components\AuthHandler;
class SiteController extends Controller
{
public function actions()
{
return [
'auth' => [
'class' => 'yii\authclient\AuthAction',
'successCallback' => [$this, 'onAuthSuccess'],
],
];
}
public function onAuthSuccess($client)
{
(new AuthHandler($client))->handle();
}
}
Где реализация AuthHandler должна быть приблизительно следующая :
<?php
namespace app\components;
use app\models\Auth;
use app\models\User;
use Yii;
use yii\authclient\ClientInterface;
use yii\helpers\ArrayHelper;
/**
* AuthHandler handles successful authentication via Yii auth component
*/
class AuthHandler
{
/**
* @var ClientInterface
*/
private $client;
public function __construct(ClientInterface $client)
{
$this->client = $client;
}
public function handle()
{
$attributes = $this->client->getUserAttributes();
$email = ArrayHelper::getValue($attributes, 'email');
$id = ArrayHelper::getValue($attributes, 'id');
$nickname = ArrayHelper::getValue($attributes, 'login');
/* @var Auth $auth */
$auth = Auth::find()->where([
'source' => $this->client->getId(),
'source_id' => $id,
])->one();
if (Yii::$app->user->isGuest) {
if ($auth) { // login
/* @var User $user */
$user = $auth->user;
$this->updateUserInfo($user);
Yii::$app->user->login($user, Yii::$app->params['user.rememberMeDuration']);
} else { // signup
if ($email !== null && User::find()->where(['email' => $email])->exists()) {
Yii::$app->getSession()->setFlash('error', [
Yii::t('app', "User with the same email as in {client} account already exists but isn't linked to it. Login using email first to link it.", ['client' => $this->client->getTitle()]),
]);
} else {
$password = Yii::$app->security->generateRandomString(6);
$user = new User([
'username' => $nickname,
'github' => $nickname,
'email' => $email,
'password' => $password,
]);
$user->generateAuthKey();
$user->generatePasswordResetToken();
$transaction = User::getDb()->beginTransaction();
if ($user->save()) {
$auth = new Auth([
'user_id' => $user->id,
'source' => $this->client->getId(),
'source_id' => (string)$id,
]);
if ($auth->save()) {
$transaction->commit();
Yii::$app->user->login($user, Yii::$app->params['user.rememberMeDuration']);
} else {
Yii::$app->getSession()->setFlash('error', [
Yii::t('app', 'Unable to save {client} account: {errors}', [
'client' => $this->client->getTitle(),
'errors' => json_encode($auth->getErrors()),
]),
]);
}
} else {
Yii::$app->getSession()->setFlash('error', [
Yii::t('app', 'Unable to save user: {errors}', [
'client' => $this->client->getTitle(),
'errors' => json_encode($user->getErrors()),
]),
]);
}
}
}
} else { // user already logged in
if (!$auth) { // add auth provider
$auth = new Auth([
'user_id' => Yii::$app->user->id,
'source' => $this->client->getId(),
'source_id' => (string)$attributes['id'],
]);
if ($auth->save()) {
/** @var User $user */
$user = $auth->user;
$this->updateUserInfo($user);
Yii::$app->getSession()->setFlash('success', [
Yii::t('app', 'Linked {client} account.', [
'client' => $this->client->getTitle()
]),
]);
} else {
Yii::$app->getSession()->setFlash('error', [
Yii::t('app', 'Unable to link {client} account: {errors}', [
'client' => $this->client->getTitle(),
'errors' => json_encode($auth->getErrors()),
]),
]);
}
} else { // there's existing auth
Yii::$app->getSession()->setFlash('error', [
Yii::t('app',
'Unable to link {client} account. There is another user using it.',
['client' => $this->client->getTitle()]),
]);
}
}
}
/**
* @param User $user
*/
private function updateUserInfo(User $user)
{
$attributes = $this->client->getUserAttributes();
$github = ArrayHelper::getValue($attributes, 'login');
if ($user->github === null && $github) {
$user->github = $github;
$user->save();
}
}
}
Для вью можно использовать уже готовый компонент виджет :
<?= yii\authclient\widgets\AuthChoice::widget([
'baseAuthUrl' => ['site/auth'],
'popupMode' => false,
]) ?>
-
@withoutname , а как должна выглядеть модель? И в данном случае как я понял пример для github.– XenKCommented 10 окт. 2016 в 14:44
-
-
-
@XenK думаю в модель будет достаточно добавить поля, которые помогут вам связать юзера с его ВК страницей, на пример,
vkProfileId
, добавить также модельVkProfile
, которая будет содержать информацию со страницы пользователя VK. Если проще - модель должна содержать некоторый объем данных, который вы рассчитываете получить с нее, и спрашивать "как должна выглядеть" - не имеет смысла, т.к. представления о подобных моделях может быть разное. Commented 13 окт. 2016 в 8:44 -