Nodejs implements uploading folders

Preface

In web development, file upload is a very common requirement, and most web applications have the function of uploading files. In some scenarios, if you need to upload an entire folder instead of a single file, you need to use some special methods. This article will introduce how to use Node.js to implement the function of uploading folders.

Implementation steps

1. Create a form

The first step to upload a file is to create an HTML form that contains the uploaded file. Because uploading a folder requires uploading multiple files, we need to use a multi-line text input box to allow the user to select the folder that needs to be uploaded. The following is a sample HTML form code:

<form action="/uploadFolder" method="POST" enctype="multipart/form-data">
    <input type="file" name="folder[]" multiple webkitdirectory directory>
    <input type="submit" value="上传">
</form>

In the above code, we use a multi-line text input box to allow the user to select the folder to be uploaded, and specify it using name="folder[]" The name of the form element to facilitate subsequent processing of multiple files.

2. Create Route

For the Express application, we need to establish a new route handler for the upload folder. In this route handler, we need to use a specific library to parse and process the form data. Specifically, we use the multer library to handle uploaded folders. The following is a sample code using the multer library:

const express = require("express");
const multer = require("multer");

const app = express();
const upload = multer({ dest: "uploads/" });

app.post("/uploadFolder", upload.any(), (req, res) => {
    console.log(req.files);
    res.send("上传成功");
});

app.listen(3000, () => {
    console.log("应用程序已启动");
});

In the above code, we use the multer library to process form data and save all uploaded files to the server in the uploads/ directory. The library includes a middleware function that upload.any() specifies that any type of file is allowed to be uploaded. In the route handler, we can use the req.files object to access all files in the uploaded folder.

3. Handling uploaded files

We can use Node.js’ built-in module to process uploaded files. Specifically, we need to use the related functions of the fs module to complete the task. The following is the sample code:

const fs = require("fs");

const files = req.files;
for (let i = 0; i < files.length; i++) {
    const file = files[i];
    const filePath = file.path;
    const originalName = file.originalname;
    const fileName = originalName.replace(/[^a-z0-9]/gi, "_").toLowerCase();
    const destPath = "uploads/" + fileName;
    try {
        fs.renameSync(filePath, destPath);
    } catch (err) {
        res.status(500).send('文件上传失败');
    }
}
res.send("上传成功");

In the above code, we first loop to read all the files in the req.files object, and then use the fs module #renameSync()The function moves each file to the specified directory. Before moving the file, we need to generate a new file name by replacing the special characters in the file name. If an error occurs while moving the file, an error message will be returned in the response.

Full code

The complete sample code can be viewed here. Therefore, we can launch the application using the following command:

node app.js

Conclusion

Uploading an entire folder is a very useful feature that can help users better organize and Manage files. Through the introduction of this article, we have learned how to use Node.js to implement the function of uploading folders. Hope this article is helpful to readers.

The above is the detailed content of Nodejs implements uploading folders. For more information, please follow other related articles on the PHP Chinese website!