NodeJS+formidable实现文件上传加自动重命名

闻风听雨_

于 2020-12-04 11:23:37 发布

阅读量1.1k

点赞数 2

分类专栏： NodeJS 文章标签： node.js 后端 html javascript http

本文链接：https://blog.csdn.net/qq_44685584/article/details/110630935

版权

NodeJS 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

前述

本人node初学者，此前使用原生node实现文件上传时遇到了一些困难，只做到了.txt 和.png两中格式的文件可以正常上传，如果上传其他格式文件服务端保存的文件会无法正常打开，原因是对form表单传来的数据处理不彻底。后来查找许多资料了解到了formidable这个第三方模块,可通过以下指令安装：

npm i formidable

官方对它的描述：

A Node.js module for parsing form data, especially file uploads.
一个专门用来处理表单数据尤其是文件上传的Node.js模块。

实现过程

首先新建一个html文件作为前端，由于这里只讲功能所有没有添加任何样式。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>上传文件</title>
</head>
<body>
  <form action="/upload" method="POST" enctype="multipart/form-data">
    <input type="file"  name="up_file" id="upload">
    <input type="submit" id="submit" name="submit">
  </form>
</body>
</html>

这里需要把form的enctype设置为multipart/form-data。
MND对此的描述：

multipart/form-data：当表单包含 type=file 的元素时使用此值。

新建main.js，用node的http模块开启http服务。

const http = require("http");
const fs = require("fs");
const formidable = require("formidable");


let server = http.createServer((req,res)=>{
  if(req.url = "/upload"){
    switch(req.method){
      case "GET":
        //使用流来加载upload.html
        fs.createReadStream("./upload.html").pipe(res);
        break;
      case "POST":
        dealUpload(req,res);
        break;
        default:
          console.log("other method...");
          break;
    }
  }else{
    res.writeHead(302,{"Location": "upload"});
    res.end();
  }
})

//监听8080端口
server.listen(8080);

console.log("listening on 8080, http://127.0.0.1:8080");

使用formidable处理表单数据，并对生成的新文件重命名。

function dealUpload(req,res){
  var form = formidable.IncomingForm();
  //保持原有扩展名
  form.keepExtensions = true;
  //设置上传目录
  form.uploadDir = __dirname + "/files/";
  form.parse(req,function(err,fields,files){
    if(err) throw err;
    console.log(fields);
    let oldFilename = files.up_file.name;
    //重命名上传的文件
    fs.rename(files.up_file.path, form.uploadDir + generateFilename(oldFilename),err=>{
      if(err) {
        console.log("重命名失败");
        console.log(err);
      }else{
        console.log("重命名成功!");
      }
    })
    res.writeHead(200,{"Content-type":"text/html;charset='utf-8'"});
    res.write('<meta charset="UTF-8" />');
    res.end("<h1>上传结束</h1>");
  })
}

function generateFilename(oldFilename){
  //将老的文件名拼上时间戳，这样既不会命名冲突又可以看出文件的上传事件
  let d = new Date();
  let names = oldFilename.split(".");
  return `${names[0]}_${""+d.getFullYear() + (d.getMonth()+1) + d.getDate() +'_'+ d.getHours() + d.getMinutes() + d.getSeconds()}.${names[1]}`;
}

运行效果

使用node main.js指令将程序运行起来，然后在浏览器输入http://127.0.0.1:8080可以看到：
在这里插入图片描述
选择一个文件后点击提交：

然后即可在之前设置保存目录下看到已保存且重命名的文件：
在这里插入图片描述

如有错误欢迎指正

闻风听雨_

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
NodeJS+formidable实现文件上传加自动重命名

前述本人node初学者，此前使用原生node实现文件上传时遇到了一些困难，只做到了.txt 和.png两中格式的文件可以正常上传，如果上传其他格式文件服务端保存的文件会无法正常打开，原因是对form表单传来的数据处理不彻底。后来查找许多资料了解到了formidable这个第三方模块,可通过以下指令安装：npm i formidable官方对它的描述：A Node.js module for parsing form data, especially file uploads.一个专门用来处理表
复制链接

扫一扫

专栏目录