Создание нового веб-приложения на платформе Express

  • 8 мин

Компании часто хранят большие объемы данных в файловых системах и базах данных. Они получают доступ к этим данным, обслуживая их через веб-приложения из API с помощью HTTP.

Веб-серверы и веб-приложения

Веб-сервер — это часть программного обеспечения, которое отвечает на запросы от клиентов. Веб-приложение находится на вершине веб-сервера. Некоторые среды, такие как Node.js, предоставляют веб-сервер и веб-приложение в платформе. В этом модуле веб-сервер предоставляется HTTP модулем. Веб-приложение предоставляется платформой Express.js и включает веб-сервер.

Подробнее:

  • Веб-приложения: приложение доставляет веб-приложение клиенту:
    • Визуально с помощью HTML, CSS и JavaScript
    • Данные с ПОМОЩЬЮ API
    • Визуальные и данные с сочетанием HTML, CSS, JavaScript и API. Это считается монолитным приложением.
  • Маршрутизация URL-адресов: маршрутизация URL-адресов — это механизм предоставления функциональных возможностей веб-сервера при запросе определенного URL-адреса. Например, URL-адрес /products может быть связан с функцией, возвращающей список продуктов. URL-адрес /products/1 может быть связан с функцией, возвращающей определенный продукт.
  • Заголовки HTTP: это пары "ключ-значение", отправляемые от клиента на сервер. Они содержат сведения о запросе или ответе.
    • Поддержка различных типов контента: клиент может запрашивать данные в определенном формате и может возвращаться в таком формате, как обычный текст, JSON, HTML или CSV.
    • Проверка подлинности и авторизация. Некоторые данные могут быть конфиденциальными. Пользователю может потребоваться войти в систему или иметь определенную роль или уровень разрешений для доступа к данным. Это обрабатывается в заголовке HTTP.
  • Обмен данными: пользователям может потребоваться просмотреть и добавить данные в систему. Чтобы добавить данные, пользователи могут вводить данные в форме или отправлять файлы.
  • Время на рынок. Чтобы эффективно создавать веб-приложения и API, выбирайте инструменты и платформы, которые предоставляют решения распространенных проблем. Эти варианты помогают разработчику быстро соответствовать бизнес-требованиям задания.

HTTP-модуль в Node.js

Node.js поставляется с встроенным модулем HTTP. Это достаточно компактный модуль, который обрабатывает большинство типов запросов. Он поддерживает распространенные типы данных, такие как заголовки, URL-адрес и данные.

Следующий пример кода — это простой веб-сервер, который прослушивает входящие запросы через порт 3000. Он реагирует на простое текстовое сообщение hello world клиенту независимо от используемого URL-адреса или заголовков HTTP.

// Include the HTTP module
const http = require('http');

// Set the port to 3000
const PORT = 3000;

// 1. Process incoming requests (req), reply with response (res)
const requestHandler = (req, res) => {

  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('hello world');
}

// 2. Create a server with the requestHandler
const server = http.createServer(requestHandler);

// 3. Start listening for incoming requests on port
server.listen(PORT, () => {
  console.log(`listening on port ${PORT}`)
})

В этом примере веб-приложение настраивается следующим образом:

  1. requestHandler: функция считывает запрос () и определяет, какой ответ (reqres) нужно отправить.
  2. сервер: createServer() метод определяется с помощью обработчика запросов. Так как существует только один обработчик запросов, сервер всегда будет отвечать с тем же ответом. В реальном приложении может быть несколько обработчиков запросов для обработки различных типов запросов и различных маршрутов. Это будет подробно описано позже.
  3. server.listen: listen() метод вызывается с указанным портом. После вызова метода listen() сервер готов принять клиентские запросы. При локальном запуске приложение будет доступно.http://localhost:3000 Инструкция console.log выполняется, чтобы сообщить разработчику, что сервер готов к использованию.

В этом примере кода Express.js используются несколько стилей функций:

  • обратный вызов в server.listen(PORT string, callback_function)
  • Функция со стрелками, в requestHandler = (req, res) => {} которой имеются разные правила область, отличные от обычной функции

платформа Express.js

Итак, вы ознакомились с возможностями HTTP-модуля в Node.js. Это отличный вариант для небольших веб-приложений. Если приложение станет большим, то такая платформа, как Express, может помочь в создании архитектуры масштабируемым способом.

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

Управление маршрутами в Express

Когда клиент выполняет запрос к веб-приложению, он использует URL-адрес, который указывает на конкретный сервер. URL-адрес может выглядеть следующим образом:

http://localhost:3000/products

Термин localhost в URL-адресе относится к собственному компьютеру. Возможно, более рабочий URL-адрес переключил термин localhost для доменного имени, например microsoft.com. Последняя часть URL-адреса — это маршрут. Он решает определенное логическое место для перехода на сервер. В этом случае маршрут имеет значение /products.

Платформа Express использует для управления маршрутами URL-адрес, маршрут и команды HTTP. HTTP-команды, такие как post, put и get, описывают действие, требуемое клиентом. У каждой команды HTTP — свое значение, указывающее, что нужно сделать с данными. Express помогает регистрировать маршруты и связывать их с соответствующими командами HTTP для организации веб-приложения. Платформа Express имеет специальные методы обработки различных команд HTTP, а также интеллектуальную систему для сопоставления маршрутов с частями кода.

В следующем примере Express помогает обрабатывать запросы, направленные на маршрут с адресом /products , связанным с HTTP-командой get:

app.get('/products', (req, res) => {
  // handle the request
})

Express отображается app.get /products так же, app.post /productsкак показано в следующем примере кода:

app.get('/products', (req, res) => {
  // handle the request
})

app.post('/products', (req, res) => {
  // handle the request
})

Команда HTTP get означает, что пользователь хочет считывать данные. Команда HTTP post означает, что они хотят записывать данные. Разделение приложения таким образом, чтобы различные пары маршрутов и глаголов выполняли разные части кода. Более подробно этот вопрос будет рассмотрен далее.

Предоставление различных типов содержимого

Express поддерживает множество различных форматов содержимого, которые можно возвратить вызывающему клиенту. Объект res поставляется с набором вспомогательных функций для возврата различных типов данных. Чтобы вернуть обычный текст, используйте метод send() следующим образом:

res.send('plain text')

Для других типов данных, таких как JSON, есть специальные методы, обеспечивающие правильный формат содержимого, а также его преобразование данных. Чтобы вернуть JSON в Express, используйте метод json()следующим образом:

res.json({ id: 1, name: "Catcher in the Rye" })

Предыдущий метод кодирования Express эквивалентен данному коду модуля HTTP:

res.writeHead(200, { 'Content-Type': 'application/json' });
res.end(JSON.stringify({ id: 1, name: "Catcher in the Rye" }))

Заголовок Content-Type в HTTP задан, и ответ также преобразуется из объекта JavaScript в строку, прежде чем вернуться обратно в вызывающий клиент.

Сравнивая два примера кода, можно увидеть, что Express сохраняет несколько строк ввода с помощью вспомогательных методов для типовых файлов, таких как JSON и HTML.

Создание приложения Express

Чтобы приступить к разработке приложения Node.js с помощью платформы Express, необходимо установить ее как зависимость. Кроме того, рекомендуется сначала инициализировать проект Node.js, чтобы все скачанные зависимости находились в файле package.json. Это общая рекомендация для всех приложений, разрабатываемых для среды выполнения Node.js. Преимущества проявляются при отправке кода в репозиторий, например GitHub. Любой пользователь, который извлекает код из GitHub, может легко использовать написанный вами код, сначала установив его зависимости.

Чтобы создать веб-приложение с помощью платформы Express, выполните следующие действия.

  1. Создайте веб-приложение: создайте экземпляр веб-приложения. На этом этапе веб-сервер не может быть запущен, но у вас есть что-то, что вы можете расширить.
  2. Определите маршруты и обработчики маршрутов: определите маршруты, на которые должно прослушивать приложение. Обычное управление маршрутами включает:
    • корневой маршрут: '/'
    • маршруты функций: "/products"
    • Маршрут catch-all: "*"
  3. Настройка ПО промежуточного слоя: ПО промежуточного слоя — это часть кода, которая может выполняться до или после запроса. Примерами являются проверка подлинности, проверка данных и ведение журнала.
  4. Запустите приложение: определите порт, а затем укажите приложению прослушивать этот порт. Теперь приложение готово к получению запросов.