Отображение необработанного HTML-кода в ответ с помощью Express — распространенное требование при создании веб-приложений. Есть несколько способов добиться этого, и в этой статье блога я расскажу о нескольких подходах вместе с примерами кода. К концу этой статьи вы получите четкое представление о том, как визуализировать необработанный HTML с помощью Express.

Метод 1: использование res.send()

Самый простой способ отобразить необработанный HTML — использовать метод res.send(), предоставляемый Express. Вы можете передать содержимое HTML в виде строки в метод send(), и Express отправит его в качестве ответа клиенту. Вот пример:

const express = require('express');
const app = express();
app.get('/', (req, res) => {
  const htmlContent = '<h1>Hello, World!</h1>';
  res.send(htmlContent);
});
app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

Метод 2: использование res.sendFile()

Другой метод визуализации необработанного HTML — использование метода res.sendFile(). Этот метод отправляет файл, указанный в качестве параметра в ответе. Вы можете создать HTML-файл, а затем использовать res.sendFile(), чтобы отправить его в качестве ответа. Вот пример:

const express = require('express');
const path = require('path');
const app = express();
app.get('/', (req, res) => {
  const filePath = path.join(__dirname, 'public', 'index.html');
  res.sendFile(filePath);
});
app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

Метод 3. Использование механизма шаблонов

Express поддерживает различные системы шаблонов, такие как EJS, Handlebars, Pug (ранее Jade) и т. д. Эти системы шаблонов предоставляют мощные функции для визуализации динамического HTML-контента. Вы можете использовать механизмы шаблонов для визуализации необработанного HTML, передавая содержимое HTML в качестве переменной в шаблон. Вот пример использования шаблонизатора EJS:

const express = require('express');
const app = express();
app.set('view engine', 'ejs');
app.get('/', (req, res) => {
  const htmlContent = '<h1>Hello, World!</h1>';
  res.render('index', { htmlContent });
});
app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

В этом примере мы устанавливаем механизм представления EJS, используя app.set(). Затем мы создаем файл EJS с именем index.ejs

<%- htmlContent %>

.

Выражение <%- htmlContent %>вставляет содержимое HTML в шаблон EJS.