【Node.js】之formidable中间件实现文件上传

最新推荐文章于 2023-05-14 23:56:40 发布

夹心776655

最新推荐文章于 2023-05-14 23:56:40 发布

阅读量446

点赞数

分类专栏： ES6&Node 文章标签： node.js javascript es6

本文链接：https://blog.csdn.net/qq_37086980/article/details/112381706

版权

ES6&Node 专栏收录该内容

22 篇文章 1 订阅

订阅专栏

formidable实现文件上传

前端必须使用post 和enctype=“mutilpart/form-data”

1、在跟目录下创建一个临时文件夹，用来存储临时文件

2、把临时的文件移动到最终的目录

使用：

（1）下载

npm i formidable

（2）引入

不用app.use

const formidable=require("formidable")

（3）创建表单对象

let form=formidable({
      uploadDir:"./tempdir",//文件临时上传路径
})

（4）将表单对象里的信息进行解析

form.parse(req,(err,fields,files)=>{
  	
})

（5）将临时文件放到最终目录中

读文件，将文件内容写入新文件

 	//解析传过来的内容 form.parse((错误参数,其他信息,文件信息)=>{})
    form.parse(req,(err,fields,files)=>{
        // console.log(fields);//{ username: 'zs', password: '123' }
        // console.log(files);

        let oldbuf=fs.readFileSync(path.join(__dirname,files.touxiang.path))
        fs.writeFileSync(path.join(__dirname,"uploads",files.touxiang.name),oldbuf)

        res.send("上传成功")

        /* 
        
        {
            "touxiang": {
                "size": 15086,
                "path": "uploads\\upload_19bdd6641d01f4bcae015568f2d36877",
                "name": "favicon.ico",
                "type": "image/x-icon",
                "mtime": "2021-01-08T08:04:17.388Z"
            }
        }
                 
        */
    })

代码实例

uploadAvatar.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>upload avatar</title>
    <style>
        input{
            margin-top: 5px;
            outline: none;
        }
    </style>
</head>
<body> 
    <form action="http://localhost:3000/uploadAvatar" method="post" enctype="multipart/form-data">
        账号：<input type="text" placeholder="请输入账号" name="username" autocomplete="off"><br>
        密码：<input type="password" placeholder="请输入密码" name="password" autocomplete="off"><br>
        <input type="file" name="avatar"><br>
        <input type="submit">
    </form>
</body>
</html>

uploadAvatar.js

const express = require('express');
const fs = require('fs');
const path = require('path');
let app = express()

const formidable = require("formidable")

app.post("/uploadAvatar", (req, res) => {
    // 生成一个表单对象
    let form = formidable({
        uploadDir: "./tempdir" // 文件临时上传目录
    })

    // 解析传过来的内容
    form.parse(req, (err, fields, files) => {
        // console.log(fields);// { username: 'jiaxin', password: '123' }
        // console.log(files.avatar.path);
        /* 
            avatar: File {
            _events: [Object: null prototype] {},
            _eventsCount: 0,
            _maxListeners: undefined,
            size: 21312,
            path: 'tempdir\\upload_1e5ee1a5ecacc6855615fa7b2dd33776',
            name: 'jiaxin.jpg',
            type: 'image/jpeg',
            hash: null,
            lastModifiedDate: 2021-01-08T11:26:06.713Z,
        }
        */
       let oldBuf = fs.readFileSync(path.join(__dirname, files.avatar.path))
       fs.writeFileSync(path.join(__dirname, "uploads", files.avatar.name), oldBuf);
       res.send("Upload Successfully!")
    })
})

app.listen(3000, () => {
    console.log(`Port 3000 is listening...`);
})

夹心776655

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
【Node.js】之formidable中间件实现文件上传

formidable实现文件上传前端必须使用post 和enctype=“mutilpart/form-data”1、在跟目录下创建一个临时文件夹，用来存储临时文件2、把临时的文件移动到最终的目录使用：（1）下载npm i formidable（2）引入不用app.useconst formidable=require("formidable")（3）创建表单对象let form=formidable({ uploadDir:"./tempdir",//文件临时上传路
复制链接

扫一扫