如何检查文件输入以了解它在 node.js 中是否为空

How to check the file input to know if it's empty in node.js

我正在尝试检查用户是否在按下上传之前实际选择了文件,如果是,则检查文件是否大于 4 MB。如果用户在没有选择文件的情况下按下了上传,那么应该发送一条消息告诉他们返回并选择一个文件。但是这段代码似乎不起作用。

<div id="postUpload-wrapper">
  <form id="uploadpost-form" action="/uploadpost" enctype="multipart/form-data" method="POST">
    <input type="text" id="postname" placeholder="Title" name="postname">
    <br>
    <input id="fileupload" type="file" name="image">
    <br>
    <input type="submit" id "uploadpost-btn" value="Upload" name="uploadpost">
  </form>
</div>

//UPLOAD A POST

router.post('/uploadpost', upload.single('image'), function(req, res){
var errors = "";

if(req.body.postname === ""){
    errors += "Write a title";
    res.send(errors);
    return false;
}

//problem here
if(req.file.size === 0){
    errors += "You need to choose a file";
    res.send(errors);
    return false;
}else{
    if(req.file.size > 4000000){
        errors += "Files can only be up to 4 MB in size";
        res.send(errors);
        return false;
    }
}

我认为您应该在允许上传文件之前在客户端进行检查。

if(document.getElementById("uploadpost-btn").value != "") {
   // you have a file
}

您可以稍后在服务器端查看。如果 req.body 有任何数据,则表示已上传文件。

尝试将 input type="submit" 元素 属性 disabled 设置为 "true" ,使用 input type="file" 元素的 onchange 事件来检查用户是否选择了文件在 FileList 对象中,将 type="submit" 元素设置为 disabled="true" ,如果 file.size 大于 4000000 字节,则为 disabled="false"。如果未选择文件,文件大小超过 4000000 字节提交按钮设置为禁用

var input = document.getElementById("fileupload");
input.onchange = function() {
  var file = this.files, submit = this.nextElementSibling.nextElementSibling;
  if (file.length > 0) {
    if (file[0].size >= 4000000) {
      submit.disabled = true;
      alert("file size limit")
    } else {
      submit.disabled = false;
      console.log(this.files)
    }
  }
}
<div id="postUpload-wrapper">
  <form id="uploadpost-form" action="/uploadpost" enctype="multipart/form-data" method="POST">
    <input type="text" id="postname" placeholder="Title" name="postname">
    <br>
    <input id="fileupload" type="file" name="image">
    <br>
    <input type="submit" id="uploadpost-btn" value="Upload" name="uploadpost" disabled="true">
  </form>
</div>