multer上传文件—单复数文件问题

最新推荐文章于 2023-08-02 11:07:04 发布

弓长张帆

最新推荐文章于 2023-08-02 11:07:04 发布

阅读量419

点赞数 2

本文链接：https://blog.csdn.net/builder_fan/article/details/87856819

版权

单文件上传时：

<input type="file" name='myfiles>

var formdata = new FormData();
console.log(event.target.files);
var file = event.target.files[0];//这里注意，event.target.files是多数组。所以单个文件上传要[0]
formdata.append("myfiles",file);

router.post('/',arr,function (req, res, next) {
  console.log(req.file);//注意，这里是file，复数文件上传用files
  res.send(req.file);
})

复数文件上传时：

<input type="file" name="myfiles" value="" multiple>

var formdata = new FormData();
console.log(event.target.files);
for(let file of event.target.files){//读取event.target.files中的值放入formdata中
  formdata.append("myfiles",file);
}

router.post('/',arr,function (req, res, next) {
  // console.log(req.file);
  // res.send(req.file);
  console.log(req.files);//注意，复数文件使用files
  res.send(req.files);
})

全部代码：

ejs代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>

    <form class="" action="/lesson15" method="post" enctype="multipart/form-data">
      <!-- <input type="file" name='myfiles> -->
      <input type="file" name="myfiles" value="" multiple>
      <input type="submit" name="" value="上传文件">
    </form>

    <script type="text/javascript">
      const input = document.querySelector("input");
      // input.onchange = function
      input.addEventListener("change",function (event) {
        var formdata = new FormData();
        console.log(event.target.files);
        for(let file of event.target.files){
        formdata.append("myfiles",file);
        // var file = event.target.files[0];
        // formdata.append("myfiles",file);
        console.log(formdata);
        };
        upload(formdata);
      });

      function upload(formdata){
        const xhr = new XMLHttpRequest();
        xhr.open("POST","/lesson15");
        xhr.onreadystatechange = function () {
          if(xhr.status == 200 && xhr.readyState == 4){
            console.log(xhr.response);
          }
        }
        xhr.send(formdata);
      }
    </script>

  </body>
</html>

js路由页代码

var express = require('express');
var router = express.Router();
const multer = require("multer");
const upload = multer({
  dest:"upload"
});

const arr = upload.array("myfiles",3);
const single = upload.single("myfiles");

router.get('/',arr,function (req, res, next) {
  res.render('15');
});

router.post('/',arr,function (req, res, next) {
  // console.log(req.file);
  // res.send(req.file);
  console.log(req.files);
  res.send(req.files);
})

module.exports = router;

弓长张帆

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
multer上传文件—单复数文件问题

单文件上传时：&lt;input type="file" name='myfiles&gt;var formdata = new FormData();console.log(event.target.files);var file = event.target.files[0];//这里注意，event.target.files是多数组。所以单个文件上传要[0]formdat...
复制链接

扫一扫