Содержание
Всем привет! В этой статье мы рассмотрим, как обрабатывать POST запросы в NodeJS.
POST запросы отличаются от GET запросов, которые мы рассматривали в прошлых статьях, тем, что данные в них передаются в закрытом виде. Это очень часто используется для передачи информации из форм. В прошлой статье мы как раз-таки создали форму, давайте ее и будем использовать для обработки POST запросов.
Поскольку такого удобного метода, как query(), для POST запросов нет, нам нужно установить дополнение под названием Body Parser. Найти вы его можете и скачать на сайте NPM.
После того, как вы его скачали и установили, подключите расширение в файле app.js:
var bodyParser = require(‘body-parser’);
Теперь напишем следующий код:
var urlencodedParser = bodyParser.urlencoded();
Это middleware для POST запросов.
Теперь начнем получать и обрабатывать наш POST запрос:
app.post(‘/contact’, urlencodedParser, function(req, res) <
res.render(‘contact-success’, );
>);
Этот код делает следующее: когда мы отправляем форму, она ссылается на страницу /contact(т.е. на саму себя) и отправляет туда POST запрос. Мы этот POST запрос перехватываем, используем наш парсер для того, чтобы сразу получить данные в нормальном виде, а затем отрисовываем страницу по шаблону contact-success(мы далее создадим этот шаблон), куда передаем объект data, содержащий объект, который вернулся из ответа метода парсера body(), со свойствами, равными именам полей формы(who, department, email) и значениями, которые мы туда ввели. В общем-то, все просто и, благодаря парсеру, похоже на обработку GET запросов.
Теперь давайте создадим шаблон views/contact-success.ejs, куда скопируем весь код из файла contact.ejs. Удалим форму и в параграфе напишем следующее:
Спасибо за обращение!
Вы связались с из отдела
Мы ответим вам на email:
Думаю, тут все понятно и пояснять не нужно.
А на этом сегодня все. Мы закончили изучение платформы NodeJS, и теперь у вас есть вся необходимая база знаний для того, чтобы создавать отличные приложения на ее основе. Однако, чтобы закрепить знания, мы создадим список дел на NodeJS в ближайшее время! Не пропустите!
Спасибо за внимание и удачи!
Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!
Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.
Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления
Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.
Порекомендуйте эту статью друзьям:
Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):
Она выглядит вот так:
Комментарии ( 0 ):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.
Copyright © 2010-2019 Русаков Михаил Юрьевич. Все права защищены.
Делаю вход к себе на сайт. Использую Node.js + Express В POST запросе обрабатываю логин и пароль и вывожу нужную страницу. После захода на страницу появляется нужная мне информация, но при обновлении страницы GET не видет (не понимает) этой информации и не рендерит страницу.
Как сделать так,чтобы GET обновлял страницу с нужной информацией ?
Обнова (мой код, с которым я работаю)
Node.js — это серверная платформа. Основная задача сервера — как можно быстрее и эффективнее обрабатывать запросы, поступающие от клиентов, в частности — от браузеров. Восьмая часть перевода руководства по Node.js, которую мы публикуем сегодня, посвящена протоколам HTTP и WebSocket.
Что происходит при выполнении HTTP-запросов?
Поговорим о том, как браузеры выполняют запросы к серверам с использованием протокола HTTP/1.1.
Если вы когда-нибудь проходили собеседование в IT-сфере, то вас могли спросить о том, что происходит, когда вы вводите нечто в адресную строку браузера и нажимаете Enter. Пожалуй, это один из самых популярных вопросов, который встречается на подобных собеседованиях. Тот, кто задаёт подобные вопросы, хочет узнать, можете ли вы объяснить некоторые довольно-таки простые концепции и выяснить, понимаете ли вы принципы работы интернета.
Этот вопрос затрагивает множество технологий, понимать общие принципы которых — значит понимать, как устроена одна из самых сложных систем из когда-либо построенных человечеством, которая охватывает весь мир.
▍Протокол HTTP
Современные браузеры способны отличать настоящие URL-адреса, вводимые в их адресную строку, от поисковых запросов, для обработки которых обычно используется заданная по умолчанию поисковая система. Мы будем говорить именно об URL-адресах. Если вы введёте в строку браузера адрес сайта, вроде flaviocopes.com , браузер преобразует этот адрес к виду http://flaviocopes.com , исходя из предположения о том, что для обмена данными с указанным ресурсом будет использоваться протокол HTTP. Обратите внимание на то, что в Windows то, о чём мы будем тут говорить, может выглядеть немного иначе, чем в macOS и Linux.
▍Фаза DNS-поиска
Итак, браузер, начиная работу по загрузке данных с запрошенного пользователям адреса, выполняет операцию DNS-поиска (DNS Lookup) для того, чтобы выяснить IP-адрес соответствующего сервера. Символьные имена ресурсов, вводимые в адресную строку, удобны для людей, но устройство интернета подразумевает возможность обмена данными между компьютерами с использованием IP-адресов, которые представляют собой наборы чисел наподобие 222.324.3.1 (для протокола IPv4).
Сначала, выясняя IP-адрес сервера, браузер заглядывает в локальный DNS-кэш для того, чтобы узнать, не выполнялась ли недавно подобная процедура. В браузере Chrome, например, есть удобный способ посмотреть DNS-кэш, введя в адресной строке следующий адрес: chrome://net-internals/#dns .
Если в кэше ничего найти не удаётся, браузер использует системный вызов POSIX gethostbyname для того, чтобы узнать IP-адрес сервера.
▍Функция gethostbyname
Функция gethostbyname сначала проверяет файл hosts , который, в macOS или Linux, можно найти по адресу /etc/hosts , для того, чтобы узнать, можно ли, выясняя адрес сервера, обойтись локальными сведениями.
Если локальными средствами разрешить запрос на выяснение IP-адреса сервера не удаётся, система выполняет запрос к DNS-серверу. Адреса таких серверов хранятся в настройках системы.
Вот пара популярных DNS-серверов:
- 8.8.8.8: DNS-сервер Google.
- 1.1.1.1: DNS-сервер CloudFlare.
Большинство людей используют DNS-сервера, предоставляемые их провайдерами. Браузер выполняет DNS-запросы с использованием протокола UDP.
TCP и UDP — это два базовых протокола, применяемых в компьютерных сетях. Они расположены на одном концептуальном уровне, но TCP — это протокол, ориентированный на соединениях, а для обмена UDP-сообщениями, обработка которых создаёт небольшую дополнительную нагрузку на системы, процедура установления соединения не требуется. О том, как именно происходит обмен данными по UDP, мы говорить не будем.
IP-адрес, соответствующий интересующему нас доменному имени, может иметься в кэше DNS-сервера. Если это не так — он обратиться к корневому DNS-серверу. Система корневых DNS-серверов состоит из 13 серверов, от которых зависит работа всего интернета.
Надо отметить, что корневому DNS-серверу неизвестны соответствия между всеми существующими в мире доменными именами и IP-адресами. Но подобным серверам известны адреса DNS-серверов верхнего уровня для таких доменов, как .com, .it, .pizza, и так далее.
Получив запрос, корневой DNS-сервер перенаправляет его к DNS-серверу домена верхнего уровня, к так называемому TLD-серверу (от Top-Level Domain).
Предположим, браузер ищет IP-адрес для сервера flaviocopes.com . Обратившись к корневому DNS-серверу, браузер получит у него адрес TLD-сервера для зоны .com. Теперь этот адрес будет сохранён в кэше, в результате, если будет нужно узнать IP-адрес ещё какого-нибудь URL из зоны .com, к корневому DNS-серверу не придётся обращаться снова.
У TLD-серверов есть IP-адреса серверов имён (Name Server, NS), средствами которых и можно узнать IP-адрес по имеющемуся у нас URL. Откуда NS-сервера берут эти сведения? Дело в том, что если вы покупаете домен, доменный регистратор отправляет данные о нём серверам имён. Похожая процедура выполняется и, например, при смене хостинга.
Сервера, о которых идёт речь, обычно принадлежат хостинг-провайдерам. Как правило, для защиты от сбоев, создаются по несколько таких серверов. Например, у них могут быть такие адреса:
- ns1.dreamhost.com
- ns2.dreamhost.com
- ns3.dreamhost.com
Для выяснения IP-адреса по URL, в итоге, обращаются к таким серверам. Именно они хранят актуальные данные об IP-адресах.
Теперь, после того, как нам удалось выяснить IP-адрес, стоящий за введённым в адресную строку браузера URL, мы переходим к следующему шагу нашей работы.
▍Установление TCP-соединения
Узнав IP-адрес сервера, клиент может инициировать процедуру TCP-подключения к нему. В процессе установления TCP-соединения клиент и сервер передают друг другу некоторые служебные данные, после чего они смогут обмениваться информацией. Это означает, что, после установления соединения, клиент сможет отправить серверу запрос.
▍Отправка запроса
Запрос представляет собой структурированный в соответствии с правилами используемого протокола фрагмент текста. Он состоит из трёх частей:
- Строка запроса.
- Заголовок запроса.
- Тело запроса.
Строка запроса
Строка запроса представляет собой одну текстовую строку, в которой содержатся следующие сведения:
- Метод HTTP.
- Адрес ресурса.
- Версия протокола.
Выглядеть она, например, может так:
Заголовок запроса
Заголовок запроса представлен набором пар вида поле: значение . Существуют 2 обязательных поля заголовка, одно из которых — Host , а второе — Connection . Остальные поля необязательны.
Заголовок может выглядеть так:
Поле Host указывает на доменное имя, которое интересует браузер. Поле Connection , установленное в значение close , означает, что соединение между клиентом и сервером не нужно держать открытым.
Среди других часто используемых заголовков запросов можно отметить следующие:
- Origin
- Accept
- Accept-Encoding
- Cookie
- Cache-Control
- Dnt
На самом деле, их существует гораздо больше.
Заголовок запроса завершается пустой строкой.
Тело запроса
Тело запроса необязательно, в GET-запросах оно не используется. Тело запроса используется в POST-запросах, а также в других запросах. Оно может содержать, например, данные в формате JSON.
Так как сейчас речь идёт о GET-запросе, тело запроса будет пустым, с ним мы работать не будем.
▍Ответ
После того, как сервер получает отправленный клиентом запрос, он его обрабатывает и отправляем клиенту ответ.
Ответ начинается с кода состояния и с соответствующего сообщения. Если запрос выполнен успешно, то начало ответа будет выглядеть так:
Если что-то пошло не так, тут могут быть и другие коды. Например, следующие:
- 404 Not Found
- 403 Forbidden
- 301 Moved Permanently
- 500 Internal Server Error
- 304 Not Modified
- 401 Unauthorized
Далее в ответе содержится список HTTP-заголовков и тело ответа (которое, так как запрос выполняет браузер, будет представлять собой HTML-код).
Разбор HTML-кода
После того, как браузер получает ответ сервера, в теле которого содержится HTML-код, он начинает его разбирать, повторяя вышеописанный процесс для каждого ресурса, который нужен для формирования страницы. К таким ресурсам относятся, например, следующие:
- CSS-файлы.
- Изображения.
- Значок веб-страницы (favicon).
- JavaScript-файлы.
То, как именно браузер выводит страницу, к нашему разговору не относится. Главное, что нас тут интересует, заключается в том, что вышеописанный процесс запроса и получения данных используется не только для HTML-кода, но и для любых других объектов, передаваемых с сервера в браузер с использованием протокола HTTP.
О создании простого сервера средствами Node.js
Теперь, после того, как мы разобрали процесс взаимодействия браузера и сервера, вы можете по-новому взглянуть на раздел Первое Node.js-приложение из первой части этой серии материалов, в котором мы описывали код простого сервера.
Выполнение HTTP-запросов средствами Node.js
Для выполнения HTTP-запросов средствами Node.js используется соответствующий модуль. В приведённых ниже примерах применяется модуль https. Дело в том, что в современных условиях всегда, когда это возможно, нужно применять именно протокол HTTPS.
▍Выполнение GET-запросов
Вот пример выполнения GET-запроса средствами Node.js:
▍Выполнение POST-запроса
Вот как выполнить POST-запрос из Node.js:
▍Выполнение PUT-запросов и DELETE-запросов
Выполнение таких запросов выглядит так же, как и выполнение POST-запросов. Главное отличие, помимо смыслового наполнения таких операций, заключается в значении свойства method объекта options .
▍Выполнение HTTP-запросов в Node.js с использованием библиотеки Axios
Axios — это весьма популярная JavaScript-библиотека, работающая и в браузере (сюда входят все современные браузеры и IE, начиная с IE8), и в среде Node.js, которую можно использовать для выполнения HTTP-запросов.
Эта библиотека основана на промисах, она обладает некоторыми преимуществами перед стандартными механизмами, в частности, перед API Fetch. Среди её преимуществ можно отметить следующие:
- Поддержка старых браузеров (для использования Fetch нужен полифилл).
- Возможность прерывания запросов.
- Поддержка установки тайм-аутов для запросов.
- Встроенная защита от CSRF-атак.
- Поддержка выгрузки данных с предоставлением сведений о ходе этого процесса.
- Поддержка преобразования JSON-данных.
- Работа в Node.js
Установка
Для установки Axios можно воспользоваться npm:
Того же эффекта можно достичь и при работе с yarn:
Подключить библиотеку к странице можно с помощью unpkg.com :
API Axios
Выполнить HTTP-запрос можно, воспользовавшись объектом axios :
Но обычно удобнее пользоваться специальными методами:
- axios.get()
- axios.post()
Это похоже на то, как в jQuery, вместо $.ajax() пользуются $.get() и $.post() .
Axios предлагает отдельные методы и для выполнения других видов HTTP-запросов, которые не так популярны, как GET и POST, но всё-таки используются:
- axios.delete()
- axios.put()
- axios.patch()
- axios.options()
В библиотеке имеется метод для выполнения запроса, предназначенного для получения лишь HTTP-заголовков, без тела ответа:
Запросы GET
Axios удобно использовать с применением современного синтаксиса async/await. В следующем примере кода, рассчитанном на Node.js, библиотека используется для загрузки списка пород собак из API Dog. Здесь применяется метод axios.get() и осуществляется подсчёт пород:
То же самое можно переписать и без использования async/await, применив промисы:
Использование параметров в GET-запросах
GET-запрос может содержать параметры, которые в URL выглядят так:
При использовании Axios запрос подобного рода можно выполнить так:
Того же эффекта можно достичь, настроив свойство params в объекте с параметрами:
Запросы POST
Выполнение POST-запросов очень похоже на выполнение GET-запросов, но тут, вместо метода axios.get() , используется метод axios.post() :
В качестве второго аргумента метод post принимает объект с параметрами запроса:
Использование протокола WebSocket в Node.js
WebSocket представляет собой альтернативу HTTP, его можно применять для организации обмена данными в веб-приложениях. Этот протокол позволяет создавать долгоживущие двунаправленные каналы связи между клиентом и сервером. После установления соединения канал связи остаётся открытым, что даёт в распоряжение приложения очень быстрое соединение, характеризующееся низкими задержками и небольшой дополнительной нагрузкой на систему.
Протокол WebSocket поддерживают все современные браузеры.
▍Отличия от HTTP
HTTP и WebSocket — это очень разные протоколы, в которых используются различные подходы к обмену данными. HTTP основан на модели «запрос — ответ»: сервер отправляет клиенту некие данные после того, как они будут запрошены. В случае с WebSocket всё устроено иначе. А именно:
- Сервер может отправлять сообщения клиенту по своей инициативе, не дожидаясь поступления запроса от клиента.
- Клиент и сервер могут обмениваться данными одновременно.
- При передаче сообщения используется крайне малый объём служебных данных. Это, в частности, ведёт к низким задержкам при передаче данных.
Протокол WebSocket очень хорошо подходит для организации связи в режиме реального времени по каналам, которые долго остаются открытыми. HTTP, в свою очередь, отлично подходит для организации эпизодических сеансов связи, инициируемых клиентом. В то же время надо отметить, что, с точки зрения программирования, реализовать обмен данными по протоколу HTTP гораздо проще, чем по протоколу WebSocket.
▍Защищённая версия протокола WebSocket
Существует небезопасная версия протокола WebSocket (URI-схема ws:// ), которая напоминает, в плане защищённости, протокол http:// . Использования ws:// следует избегать, отдавая предпочтение защищённой версии протокола — wss:// .
▍Создание WebSocket-соединения
Для создания WebSocket-соединения нужно воспользоваться соответствующим конструктором:
После успешного установления соединения вызывается событие open . Организовать прослушивание этого события можно, назначив функцию обратного вызова свойству onopen объекта connection :
Для обработки ошибок используется обработчик события onerror :
▍Отправка данных на сервер
После открытия WebSocket-соединения с сервером ему можно отправлять данные. Сделать это можно, например в коллбэке onopen :
▍Получение данных с сервера
Для получения с сервера данных, отправленных с использованием протокола WebSocket, можно назначить коллбэк onmessage , который будет вызван при получении события message :
▍Реализация WebSocket-сервера в среде Node.js
Для того чтобы реализовать WebSocket-сервер в среде Node.js, можно воспользоваться популярной библиотекой ws. Мы применим её для разработки сервера, но она подходит и для создания клиентов, и для организации взаимодействия между двумя серверами.
Установим эту библиотеку, предварительно инициализировав проект:
Код WebSocket-сервера, который нам надо написать, довольно-таки компактен:
Здесь мы создаём новый сервер, который прослушивает стандартный для протокола WebSocket порт 8080 и описываем коллбэк, который, когда будет установлено соединение, отправляет клиенту сообщение ho! и выводит в консоль сообщение, полученное от клиента.
Вот рабочий пример WebSocket-сервера, а вот — клиент, который может с ним взаимодействовать.