В этом быстром 5-минутном чтении я хочу поделиться с вами, как использовать пакет «connect-flash» для вашего экспресс-приложения. Поехали!

connect-flash - это библиотека, которая позволяет отправлять сообщения всякий раз, когда вы перенаправляетесь на другую веб-страницу. Как правило, когда вы входите на веб-сайт, в верхней части экрана «мигает» сообщение, указывающее на успешный или неудачный вход в систему.

Как можно воссоздать вышеупомянутую функциональность, не увязнув во всех мельчайших деталях ее реализации? Введите коннект-флеш.

Сначала установите простое приложение Express в своем каталоге. Затем введите: `` npm i express-session connect-flash nodemon ''. В качестве альтернативы вы можете либо клонировать мое репо, либо читать дальше.



Во-вторых, создайте файл app.js в корне вашего приложения. Здесь мы поиграем с нашим кодом, чтобы разобраться в деталях connect-flash.

В-третьих, введите приведенный ниже код в файл app.js.

А теперь давайте пройдемся строка за строкой.

В строке 1 мы импортируем библиотеку экспресс-фреймворка. Эта библиотека абстрагирует множество функций, связанных с маршрутизацией в приложении Node.JS. Express также предоставляет нам дополнительные функции, такие как «промежуточное ПО», которое позволяет разработчикам делать все, что угодно, с объектами запросов и ответов. В данном случае «connect-flash» - это промежуточное ПО, которое добавляет «что-то» к запросу.

В строке 2 мы создаем экземпляр express, вызывая его (т.е. мы создаем простое экспресс-приложение).

В строке 3 мы назначаем номер порта постоянному порту. Обратите внимание, что «ПОРТ» в process.env.PORT написано заглавными буквами. Это важно, если вы хотите разместить свое приложение на Heroku, поскольку Heroku смотрит на process.env.PORT, чтобы определить, какой порт должно открываться вашим приложением.

Примечание. Объект process - это global, который предоставляет информацию о текущем процессе Node.js и управляет им. Как глобальный, он всегда доступен для приложений Node.js без использования require(). К нему также можно получить явный доступ с помощью require().

В строках 5 и 6 мы импортируем библиотеки «express-session» и «connect-flash».

Примечание. «Экспресс-сеанс» упрощает процесс создания HTTP-запросов с отслеживанием состояния. Это делается путем сохранения данных, таких как идентификатор пользователя, в файле cookie сеанса и отправки их обратно клиенту. Поскольку HTTP-запросы не имеют состояния (то есть сервер не может определить, были ли два запроса сделаны одним и тем же клиентом), клиент может отправить файл cookie сеанса обратно на сервер. Затем сервер проверит и подтвердит идентификатор пользователя, чтобы узнать, поступил ли этот запрос от того же клиента.

По соображениям безопасности рекомендуется всегда шифровать идентификатор пользователя секретом, хранящимся на сервере.

В строках 8–12 мы реализуем промежуточное программное обеспечение сеанса и добавляем несколько параметров, таких как секрет для шифрования данных cookie сеанса и установка saveUninitialized и resave в значение true.

Примечание. Прочтите https://stackoverflow.com/questions/40381401/when-to-use-saveuninitialized-and-resave-in-express-session, чтобы установить saveUnitialized и повторно сохранить значение true. Короче говоря, saveUnitialized предотвращает перегрузку вашего приложения из-за слишком большого количества пустых сеансов, а повторное сохранение гарантирует, что сеансы не будут удалены, даже если они простаивают в течение длительного времени.

В строке 14 мы реализуем еще одно промежуточное ПО - «connect-flash».

А вот и самая лучшая часть: в строках 16–19 мы создаем конечную точку «/». Мы также вызвали функцию flash () для объекта запроса, предоставленного нам промежуточным программным обеспечением. Мы передали два аргумента: первый - ключ, а второй - значение. Вы можете назвать их как угодно, но запомните название клавиши. Затем мы перенаправили пользователя или запрос на конечную точку «/ contact».

Примечание. Конечная точка или маршрут означают одно и то же.

В строках 21–23 мы создали конечную точку «/ contact». Здесь мы вызвали функцию req.flash (‘message’) и передали ключ (то есть сообщение), который был определен ранее в конечной точке ‘/’. Ответ, который вы получите после перенаправления на «/ contact», - это значение (т.е. второй аргумент, который вы передали в req.flash ()).

Это означает, что «connect-flash» создает временную связь между двумя конечными точками, чтобы сделать одну простую вещь: отобразить сообщение после перенаправления.

Типичным примером использования может быть отображение сообщения «Вы успешно вошли в систему» ​​после того, как пользователь войдет в систему на вашей странице входа и будет перенаправлен на вашу домашнюю страницу. В противном случае на странице входа в систему будет отображаться сообщение «Приносим извинения за неверное имя пользователя или пароль» (что является перенаправлением на самого себя).

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

Строки 27 и последующие настраивают порт для прослушивания входящих запросов.

Теперь, когда вы знаете, как использовать «connect-flash», вы можете начать использовать его с шаблонами просмотра. Надеюсь, эта статья была вам полезна, и если у вас возникнут вопросы, дайте мне знать в комментариях ниже!