
В этом руководстве мы рассмотрим вариант frontend авторизации пользователя с использованием встроенного процессора MODX security/login. Этот метод по сравнению с другими является наиболее простым, надежным и универсальным в реализации.
В руководстве также используются сниппеты AjaxForm и FormIt (поэтому проверьте в менеджере пакетов, что они установлены).
Добавьте код, выводящий форму и запускающий выполнение авторизации, в поле Содержимое соответствующего ресурса.
[[!AjaxForm?
&snipet=`FormIt`
&frontend_js=`assets/js/myform.js`
&form=`loginPopupFormTpl`
&hooks=`loginHook`
&errtpl=`[[+error]]`
&validate=`username:required,password:required`
&validationErrorMesage=`Во время авторизации произошли ошибки`
&successMesage=`Авторизация успешно завершена`
&submitVar=`sendLogin`
]]
Конечно, при полноценной разработке, я избегаю размещения кода вызова сниппета в содержимом ресурса и убираю это все в код шаблона или чанка, который используется в шаблоне, а поле "Содержимое" оставляю только для обычного содержимого вроде текстов и изображений, которые должны размещаться на странице. Но для демонстрации работы, такой способ вполне подойдет.
Вызов сниппета AjaxForm производится с обработчиком форм FormIt и необходимыми параметрами, которые по порядку рассмотрим ниже.
Создайте чанк loginPopupFormTpl содержащий описание формы авторизации, со следующим кодом.
<form data-redirect="[[~3]]">
<div class="row">
<div class="col-sm-12">
<input type="text" placeholder="Имя пользователя" name="username"/>
<span data-error-from="username"></span>
</div>
<div class="col-sm-12">
<input type="password" placeholder="Пароль" name="password"/>
<span data-error-from="password"></span>
</div>
<div class="col-sm-12">
<button class="btn btn-primary" type="submit" name="sendLogin" value="1">
Вход
</button>
</div>
</div>
</form>
Здесь [[~3]] — это ID ресурса, куда необходимо перенаправить пользователя после успешной авторизации. Поля span предназначены для вывода ошибок в процессе авторизации. Остальной код не нуждается в комментариях.
Так как, после успешной авторизации необходимо выполнить перенаправление пользователя, допустим в личный кабинет, то возложим эту задачу на JavaScript. Для этого в вызове сниппета AjaxForm укажем свой скрипт-обработчик myform.js, расположенный по адресу /assets/js/
.
...
&frontend_js=`assets/js/myform.js`
...
Cоздадим его из оригинального скрипта AjaxForm. Для этого скопируйте из папки /assets/components/ajaxform/js/
файл default.js по адресу указанному в вызове сниппета и переименуйте его в myform.js. Откройте файл в редакторе и найдите код, который выполняется в случае отсутствия ошибок при успешной отправке формы.
else {
AjaxForm.Message.success(response.message);
form.find('.error').removeClass('error');
form.find('[data-error-for]').html('');
form[0].reset();
}
Перед закрывающей скобкой добавьте перенаправление на адрес, указанный в атрибуте data-redirect формы авторизации.
if(form.attr('data-redirect')){
window.location.href = form.attr('data-redirect');
}
Таким образом, если указаны правильно логин и пароль пользователя, то произойдет перенаправление на указанную страницу. Сохраните изменения сделаные в скрипте.
Подробнее о кастомизации AjaxForm для использования своих файлов можно узнать в этом видео.
Теперь приступим непосредственно к процессу выполнения авторизации. Создайте в сниппетах хук с именем loginHook и вставьте следующий код
<?php
$properties = array(
'login_context'=>'web',
'username'=>$hook->getValue('username'),
'password'=>$hook->getValue('password'),
'rememberme'=>true,
)
$response=$modx->runProcessor(
'security/login',
$properties
);
if(!$response){
$hook->addError('username','Системная ошибка');
return false;
}
if($errors = $response-> getFieldErrors()){
foreach($errors as $error){
$hook->addError($error->getField(),$error->getMessage());
}
return false;
}
if($response->isError()){
$hook->addError('username',$response->getMessage());
return false;
}
return true;
Рассмотрим подробнее его логику работы.
Вначале запишем в переменную $properties необходимые параметры вызова процессора. Как Вы уже поняли, функция getValue() получает значение поля из формы. Обратите внимание, что имена полей формы должны совпадать с параметрами вызова этой функции.
$properties = array(
'login_context'=>'web',
'username'=>$hook->getValue('username'),
'password'=>$hook->getValue('password'),
'rememberme'=>true,
)
Далее находится код, запускающий процессор login с параметрами определёнными выше. В результате переменной $response будет присвоен полученный объект.
$response=$modx->runProcessor(
'security/login',
$properties
);
Процессоры системы MODx находятся по адресу core/model/modx/processors/
. Соответственно в нашем вызове мы работаем с файлом login.class.php лежащем в core/model/modx/processors/security/
.
Далее следует код, выполняющий анализ полученного ответа процессора. Если процессор не отработал по какой-либо причине (переменная $response пустая), то в поле username выведем сообщение Системная ошибка и прекратим работу нашего хука.
if(!$response){
$hook->addError('username','Системная ошибка');
return false;
}
Если в результате работы процессора возникли ошибки, то запишем их в соотвествующие поля и завершим работу хука.
if($errors = $response-> getFieldErrors()){
foreach($errors as $error){
$hook->addError($error->getField(),$error->getMessage());
}
return false;
}
if($response->isError()){
$hook->addError('username',$response->getMessage());
return false;
}
В случае отсутствия каких-либо ошибок в работе процессора, т.е. введенные логин и пароль верны, завершим выполнение хука со значением true.
return true;
Разберем оставшиеся параметры вызова сниппета AjaxForm. Параметр &validate
задается разделенным запятыми списком полей для проверки. Запуск с ключом username:required,password:required определяет, что поля username и password не должны быть пустыми. Задание &validationErrorMesage
и &successMesage
определяет выводимые сообщения в случае ошибки и успешной отправки формы соответственно. Свойство &submitVar
задает имя POST-переменной для обработки формы (значение должно совпадать с именем поля submit формы авторизации).
После того, как весь код написан проверьте работу авторизации.
Не так давно я создал большой курс по разработке интернет-магазинов на MODX Revolution, в котором помимо основных функций интернет-магазина я обучаю, как создавать личные кабинеты на MODX, где, как раз, мы гораздо глубже погружаемся в тему авторизации, регистрации и восстановления пароля.
В этом руководстве рассмотрен способ организации процесса авторизации штатными средствами MODX, путем использования процессора login. Как видно, построение логики работы без сторонних плагинов, не представляет собой ничего сложного. Необходимо только разобраться в работе нужного процессора и запустить его, как правило, с набором необходимых параметров. На примере этого руководства не составит никакого труда написать обработчик формы на процессоре logout, который будет выполнять деавторизацию (выход или разлогинивание) пользователя.