Yii2 flash сообщения с оформлением в стиле bootstrap alerts
  • 1279

Yii2 flash сообщения, оформленные в стиле bootstrap alerts.

Автор: admin | 02 декабря (Вс.) 2018г. в 22ч.14м.

Что такое flash-сообщения в yii2.

В yii2 существует класс, который работает с сессиями yii\web\Session. Этот класс представляет из себя некую обертку над тем, что имеет php для работы с сессиями, добавляя полезный функционал, что облегчает жизнь для разработчика. К данному полезному функционалу можно отнести и работу с flash сообщениями. В отличие от данных, которые хранятся в сессии, флэш сообщения не сохраняются на протяжении всей сессии, а доступны только один раз, затем они удаляются (по умолчанию).

Где применяются флэш сообщения yii2.

 Безусловно, так как flesh-сообщения это по сути данные, которые хранятся в сессии, то применять их можно не только для хранения сообщений. Но ввиду того, что эти данные "живут" до следующего извлечения их где-либо в программе, то наибольшее применение этот функционал получил именно для вывода одноразовых сообщений или уведомлений. Например, когда пользователь заполнил форму регистрации и нажал submit, то появление сообщения о том, что на почтовый адрес отправлено письмо для подтверждения регистрации. 

Оформление flesh-сообщений с Alerts bootstrap.

Для оформления сообщений в стиле bootstrap Alerts блоков можно воспользоваться виджетом yii\bootstrap\Alert ,который реализован в yii2. Вот так красиво выглядят сообщения в стиле bootstrap alerts:

Практика применения flash сообщений в стиле bootstrap Alerts в yii2.

Рассмотрим пример применения сообщений на сайте. Допустим, что в нашем сайте все flesh уведомления будут зафиксированы на экране, так, чтобы пользователь точно их заметил. Создадим отдельный файл в папке views/layouts/_messages.php в котором будет организован шаблон вывода всех уведомлений. Для оформления используем виджет yii2 Alert:
<?php
use yii\bootstrap\Alert;
/* 
 * Выведем все сообщения в цикле.
 */
echo '<div class="fullscreen">';

foreach (Yii::$app->session->getAllFlashes() as $key => $message) {
    //Проверим, существует ли сессия по ключу
    if(Yii::$app->getSession()->hasFlash($key)){
        echo Alert::widget([
            'options' => [
//Тут задаем css класс для оформления текущего блока сообщения
//В bootstrap 3 alerts есть такие классы - 'success', 'info', 'warning', 'danger'
//В данном случае $key - это имя сообщения, а содерание - $message
//Если имя сообщения не соответствует четырем названиям классов в alerts стилях, то
//создаем один из классов как стиль по умолчанию.
                'class' => (in_array($key, ['success', 'info', 'warning', 'danger']) ? 'alert-' . $key : 'alert-info'),
            ],
            'body' => $message,
        ]);
    }
    
    
}

echo '</div>';

//Добавим стилей, чтобы сообщения были фиксированы на экране, чтобы точно были замечены //пользователем.
$css = <<<CSS
div.fullscreen {
    position: fixed;
    z-index: 10000;
    width: 100%; 
    height: auto;
    padding: 0 2%;
    top: 30px; 
    left: 0;
}        
        
CSS;

//Регистрируем стили в приложении
Yii::$app->getView()->registerCss($css);​

Подключим блок сообщений в нужном месте шаблона:

...
<body>
<?php $this->beginBody() ?>

<?= $this->render('//layouts/_messages') ?> 

...

Теперь создадим сообщение, которое будет уведомлять пользователя об успешном входе на сайт под своей учетной записью. Для этого в контроллере создадим экшен и в нем разместим сообщение для пользователя:

    public function actionLogout()
    {
        Yii::$app->user->logout();
        $mes = 'You logged out! Good bye!'
        Yii::$app->getSession()->setFlash('info', $mes);
        return $this->goHome();
    }

После того как пользователь залогинился, то с помощью редиректа он перемещается на главную страницу, где показывается уведомление. После того, как сообщение получено, оно будет удалено и при перезагрузке страницы мы данного уведомления не увидем. 
Можно также вывести отдельное сообщение по имени ключа. Делается это так:

echo $session->getFlash('currentMessage');

Таким образом можно получить как отдельное сообщение по ключу getFlash($key), так и массив всех сообщений с помощью getAllFlashes()
А чтобы проверить, существует ли сообщение - есть метод (boolean) hasFlash($key) .Чтобы удалить сообщения по ключу можно воспользоваться removeAllFlashes($key)

Чтобы добавить сообщение используются методы setFlash('keyName', 'Text') и addFlash('keyName', 'Text') Разница этих методов в том, что Session::setFlash() перезаписывает данные по определенному ключу, если он был уже установлен ранее и записывает следующее сообщение на месте предыдущего. А метод Session::addFlash() не перезаписывает значения с одинаковым ключом, а добавляет их в массив. Поэтому для вывода сообщений, которые были добавлены с помощью addFlash() нужно использовать перебор в цикле:

Yii::$app->getSession()->addFlash('info', 'Message 1');
Yii::$app->getSession()->addFlash('info', 'Message 2');
Yii::$app->getSession()->addFlash('info', 'Message 3');
Yii::$app->getSession()->addFlash('info', 'Message 4');

$flashInfo = Yii::$app->getSession()->getFlash('info');

//проверяем, существует ли flash сообщение с нужным ключем
if(Yii::$app->getSession()->hasFlash('info')){
    if(is_array($flashInfo)){
      //Теперь выводим сообщения в цикле
      foreach($flashInfo as $message){
           echo $message . '<br>';
      }
    }else{
           //выводим сообщение
           echo $flashInfo . '<br>';
    }
}

Таким образом мы можем вывести сообщения, добавленные как с помощью Session::setFlash() так и с Session::addFlash()
Если нужно вывести все сообщения, то воспользуемся Session::getAllFlashes():

$flashes = Yii::$app->getSession()->getAllFlashes();
 foreach($flashes as $key => $message){
   //проверяем, существует ли flash сообщение с нужным ключем
   if(Yii::$app->getSession()->hasFlash($key)){
     //если по данному ключу массив  
     if(is_array($key)){
         //Теперь выводим сообщения в цикле
         foreach($key as $mes){
              echo $mes . '<br>';
         }
       }else{
           //выводим сообщение
           echo $message . '<br>';
       }
   }
}

Данный код можно использовать в качестве обработки flash сообщений всего сайта, разместив его в нужном месте шаблона.

Приветствую!

Меня зовут Сергей. Я - автор этого блога.

Если Вам был полезен материал на моем сайте, поддержите пожалуйста мой проект, чтобы о нем узнали другие люди - кликните plizz :) на иконку в соц. сети, чтобы поделиться материалом с другими.