How nodejs runs html files

With the development of front-end technology, more and more websites adopt dynamic front-end rendering methods, especially single-page applications based on frameworks such as React and Vue. These applications package various modules and components through webpack, etc. The tools are packaged into static resource files and eventually run in the browser. However, sometimes we need to run source code or HTML files on the Node.js server for the convenience of development, testing, or operations teams. This article will dive into how to run HTML files in a Node.js environment.

1. Using the Express framework

Express is one of the most popular web frameworks in Node.js. It provides an infrastructure for quickly building web applications and can also be used to render HTML files. . First, install Express:

npm install express --save

Next, we can create a simple Express server to handle HTML file requests:

const express = require('express')
const path = require('path')
const app = express()

const port = 3000

// 设置静态目录
app.use(express.static(path.join(__dirname, 'public')))

app.get('/', (req, res) => {
  res.sendFile(path.join(__dirname, 'public', 'index.html'))
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})

In the above code, we create an Express server, And set up a static directory public. When the browser requests files in this directory, Express will automatically return these static files for us. At the same time, we have also set up a route to handle requests from the root path, which will return the index.html file. Now, we can create a index.html file in the public directory, which can be seen in the browser by accessing http://localhost:3000 This page is up.

2. Use the http module

The core module http of Node.js can also handle HTTP requests and responses. We can use the http module to start a simple HTTP server to process HTML file requests. As follows:

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

const port = 3000

const server = http.createServer((req, res) => {
  const filePath = path.join(__dirname, 'public', 'index.html')
  fs.readFile(filePath, (err, data) => {
    if (err) {
      res.writeHead(500, { 'Content-Type': 'text/plain' })
      res.end('Internal Server Error')
      return
    }
    res.writeHead(200, { 'Content-Type': 'text/html' })
    res.end(data)
  })
})

server.listen(port, () => {
  console.log(`Server running at http://localhost:${port}/`)
})

In the above code, we use the core module http of Node.js to create an HTTP server, process the HTTP request, and send the index.html file to the client. terminal to view in a browser.

3. Using the fs module

If we do not need to use an HTTP server, we can also directly use the fs module to read and return HTML files. The code is as follows:

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

const port = 3000

const server = http.createServer((req, res) => {
  const filePath = path.join(__dirname, 'public', 'index.html')
  fs.readFile(filePath, (err, data) => {
    if (err) {
      res.writeHead(500, { 'Content-Type': 'text/plain' })
      res.end('Internal Server Error')
      return
    }
    res.writeHead(200, { 'Content-Type': 'text/html' })
    res.end(data)
  })
})

server.listen(port, () => {
  console.log(`Server running at http://localhost:${port}/`)
})

In the above code, we use the fs module to read the public/index.html file and send it to the client.

4. Summary

This article introduces three methods of running HTML files in the Node.js environment: using the Express framework, using the http module, and using the fs module. Among them, using the Express framework is the most commonly used method. It provides more functions, such as template engine, routing, middleware, etc., and also facilitates us to build more complete web applications. Using the http and fs modules is relatively simple and suitable for simple tasks, such as reading and returning HTML files.

The above is the detailed content of How nodejs runs html files. For more information, please follow other related articles on the PHP Chinese website!