Home > Web Front-end > Front-end Q&A > Let's talk about how nodejs adds html to the request page

Let's talk about how nodejs adds html to the request page

PHPz
Release: 2023-04-07 10:45:19
Original
757 people have browsed it

Node.js is a JavaScript runtime based on the Chrome V8 engine that makes it easy to build high-performance, scalable web applications. In Node.js, we can use various modules and packages to extend our applications to achieve more powerful functionality. In this article, we will explain how to add HTML to the request page.

  1. Using a template engine

A template engine is a tool that combines data and templates to generate HTML. There are many template engines to choose from in Node.js, such as EJS, Handlebars, and Pug. Use them to easily render data dynamically into HTML pages.

The following is an example of using the EJS template engine:

First, install the EJS module:

npm install ejs
Copy after login

Then, use the following code to add EJS to your application:

const express = require('express');
const app = express();
const ejs = require('ejs');
app.set('view engine', 'ejs');
Copy after login

In the code, we use the app.set method to define EJS as our view engine so that we can use EJS templates in the application.

Next, we can create a simple EJS template to render data into HTML:

<!DOCTYPE html>
<html>
<head>
    <title><%= title %></title>
</head>
<body>
    <h1><%= message %></h1>
</body>
</html>
Copy after login

In the EJS template, we can access it through "<%= %>" JavaScript variables and logic. In this example, "title" and "message" are the data passed into the template from the server.

Finally, we can render the data into the view using the following code:

app.get('/', (req, res) => {
    res.render('index', { title: 'Node.js', message: 'Hello World!' });
});
Copy after login
  1. Using streams

In Node.js, we can use Stream to dynamically add data to HTML documents. Among them, the Readable stream is used to read data from the source, and then the Writable stream is used to write data to the target. In this way we can easily convert the HTML document into a readable stream, and insert the HTML data that needs to be inserted into the writable stream.

The following is a simple example:

const http = require('http');
const fs = require('fs');

http.createServer(function (req, res) {
  res.writeHead(200, { 'Content-Type': 'text/html' });
  const readable = fs.createReadStream(__dirname + '/index.html');
  readable.pipe(res);
}).listen(3000);
Copy after login

In the above example, we first create a readable stream using the createReadStream method and then pass the HTML document to the stream middle. We then use the pipe method to write the stream into the response, thereby dynamically adding the content from the HTML file to the requested page.

Summary:

Node.js makes it very easy to add HTML to the requested page. The template engine method can be used to dynamically render data into an HTML page, while the stream can be used to dynamically add HTML files to the requested page. You can choose a suitable method to complete the task based on your needs.

The above is the detailed content of Let's talk about how nodejs adds html to the request page. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template