Nodejs builds static resource server-Front-end Q&A-php.cn

Nodejs builds static resource server

WBOY

Release： 2023-05-12 12:31:07

Original

1930 people have browsed it

With the development of the Internet, Web development has become a very popular industry around the world. For developers, in order to develop and publish code quickly and effectively, we need a static resource server to help us Managing and processing static resources, especially in the development model where the front and back ends are separated, is used more frequently. Node.js has become a very popular development language since its release, and its http module is particularly suitable for building static resources. Resource server. In this article, we will introduce how to use Node.js to build a lightweight static resource server.

1. Install Node

First we need to install Node.js, which is a server-side programming language based on JavaScript and can be downloaded and installed on the official website.

2. Initialize the project

We need to create a folder locally and initialize a Node project for it.

Enter the following command on the command line:

mkdir node-static-server
cd node-static-server
npm init

Copy after login

After entering the above command, we will be prompted to build the initialization parameters of this project. You can also press Enter to use the default value.

Create a file named index.html in the project and add a simple html tag in it, as shown below:

<!DOCTYPE html>
<html>
<head></head>
<body>
  <h1>Hello, World!</h1>
</body>
</html>

Copy after login

3. Create the server

In Create a file named server.js in the project and use the built-in http module of Node.js to create a web server. The code is as follows:

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

const server = http.createServer((req, res) => {
  // 处理首页请求
  if (req.url === '/') {
    fs.readFile(path.join(__dirname, 'index.html'), (err, data) => {
      if (err) {
        res.writeHead(500);
        return res.end('Error loading index.html');
      }

      res.writeHead(200);
      res.end(data);
    });
  } else {
    // 处理其他静态文件请求
    const filePath = path.join(__dirname, req.url);
    fs.readFile(filePath, (err, data) => {
      if (err) {
        res.writeHead(404);
        return res.end('404 not found');
      }

      res.writeHead(200);
      res.end(data);
    });
  }
});

const port = process.env.PORT || 3000;
server.listen(port, () => console.log(`Server running at http://localhost:${port}`));

Copy after login

4. Run the server

In the command Enter the following command in the line to start the server:

node server.js

Copy after login

Open http://localhost:3000 in the browser, and you can see that our static resource server is running.

If everything goes well, when we access http://localhost:3000/ in the browser, it will render the content we wrote in index.html.

5. Handling different static file requests

In addition to the home page response, we also need to handle requests for other static files, such as CSS, JS and image files, etc. This can be done by Add the corresponding static resource directory to request different types of static files. Here, we created a directory named public to store static files. The following code will map the contents of this directory to the root directory of the server:

const server = http.createServer((req, res) => {
  if (req.url === '/') {
    // 处理首页请求省略
  } else {
    // 处理其他静态文件请求
    const filePath = path.join(__dirname, 'public', req.url);
    fs.readFile(filePath, (err, data) => {
      if (err) {
        res.writeHead(404);
        return res.end('404 not found');
      }

      if (req.url.endsWith('.css')) {
        res.writeHead(200, { 'content-type': 'text/css' });
      }

      if (req.url.endsWith('.js')) {
        res.writeHead(200, { 'content-type': 'application/javascript' });
      }

      if (req.url.endsWith('.png')) {
        res.writeHead(200, { 'content-type': 'image/png' });
      }

      res.end(data);
    });
  }
});

Copy after login

6. Summary

It is simple and convenient to build a static resource server using Node.js. By using the built-in http module, you can easily create a basic server to handle requests for static resources, such as HTML, CSS, JS and images, etc. In the future development process, we can choose a suitable server framework according to our own needs to achieve a more efficient and powerful server.

The above is the detailed content of Nodejs builds static resource server. For more information, please follow other related articles on the PHP Chinese website!