Nodejs builds website resource path-Front-end Q&A-php.cn

Nodejs builds website resource path

WBOY

Release： 2023-05-18 10:38:07

Original

600 people have browsed it

Node.js is a back-end development language that can be used to quickly build efficient and stable web applications. In Node.js, building website resource paths is one of the skills that must be mastered. This article will introduce how to use Node.js to build website resource paths.

1. Build a basic HTTP server
Before starting to build our Node.js resource path, we need to build a basic HTTP server first. Developers can use the built-in module http of Node.js to build this HTTP server. The code is as follows:

const http = require('http');

const server = http.createServer((req, res) => {
  res.end('Hello World!');
});

server.listen(3000, () => {
  console.log('Server is listening on port 3000');
});

Copy after login

In the code, we create an HTTP server through http.createServer() and pass res.end( ) method returns the text "Hello World!" to the browser. Among them, req is the request object and res is the response object. In addition, we also listen to port 3000 through the server.listen() method so that the server can be started on this port.

If you want to verify whether the HTTP server is successfully built, you can enter node app.js in the command line (assuming your file is named app.js), and then enter in the browser http://localhost:3000, you can see "Hello World!" displayed on the page.

2. Configure static resource paths
When we build a website, it usually contains many static resources, such as images, CSS, JavaScript, etc. The paths of these resources also need to be configured. In Node.js, the static resource path can be implemented through the express framework. The code is as follows:

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

app.use(express.static('public'));

app.listen(3000, () => {
  console.log('Server is listening on port 3000');
});

Copy after login

In the code, we first imported the express framework and told the express framework that we use the app.use() method. Static resources need to be provided to users. Among them, public is the folder name of the static resources, which is the local path where the static resources are stored.

Of course, developers can modify this folder name according to their own needs. They only need to change the public in the code to the folder name you define. In this example, we store static resources in the public folder.

3. Test the static resource path
After setting up the static resource path, we can place some files in the public folder for testing. For example, place an image myimage.jpg in the public folder, and then use it in the code, the code is as follows:

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

app.use(express.static('public'));

app.get('/', function(req, res) {
  res.send(`
  <html>
    <head>
      <title>Node.js Resource Path Test</title>
    </head>
    <body>
      <h1>Welcome to the Node.js Resource Path Test</h1>
      <img src="images/myimage.jpg" alt="My Image">
    </body>
  </html>
  `);
});

app.listen(3000, () => {
  console.log('Server is listening on port 3000');
});

Copy after login

In the code we pass<img src="images/myimage. jpg" alt="My Image"> to reference the image myimage.jpg. What needs to be noted here is that because we use the express framework to handle our static resource paths, we need to keep it public when referencing the image in the code. The path to the folder, that is, use the relative path "images/myimage.jpg" to reference the image.

If you want to verify whether the image is successfully referenced, you can visit "http://localhost:3000/" in the browser, and you will see that our image "myimage.jpg" is displayed on the page.

4. Conclusion
Through the above steps, we can quickly build a Node.js website that can provide static resource services. At the same time, in this process, I also learned how to use the built-in http module of Node.js to build a basic HTTP server and how to use the express framework to configure static file paths. Finally, we also tested the configuration steps of the static resource path and quoted a picture to verify whether our configuration achieved the expected effect.

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