Javascript 如何使用node js和express将图像上载到mongodb

我正在制作一个网络应用程序，允许用户上传和搜索食谱。用户可以通过填写表单并按下按钮来执行POST请求来上传配方。我设法保存了recipe对象，但无法为其分配图像。我试图使用Multer，但当我使用

log（req.file）

时，我得到了

“欠定义”

。我学习了YouTube教程，其中只有

app.js

和

index.ejs

，而且效果很好，所以我不知道是不是我的Ajax代码导致了这个问题

我有

main.handlebar

和

main.css

，我有一个名为uploads的文件夹，但在终端中始终未定义，下面是我代码的一部分： 谢谢

上传.车把：

      <label for="Userphrase">Recipe Name:</label>
  <input type = "text" name = "recipeName" id = "recipeName"><br>

  <label>Upload an image:</label>

  <div class="container">
  <input name="myImage" type="file"<br>
</div>
.
.
.
<script type = "text/javascript" src = "/public/palindrome.js"></script>

index.js： 在顶部，我有：

const storage = multer.diskStorage({
destination: './public/uploads/',
filename: function(req, file, cb){
    cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname));
}
});

const upload = multer ({
storage: storage
}).single('myImage');

在邮递路线内，我有：

router.post('/upload',(req,res)=>{
 upload(req, res, (err) => {
if(err){
    res.render('index',{
        msg: err
    });
}else{
    console.log(req.file);
    res.send('test');
}
});

---

您必须以如下格式发送图像数据

var formData = new FormData();
formData.append('imageName', imageFile);

在节点端，multer的用户名（“imageName”）将从中获取图像 更多信息请访问Mutter check

---

为了简单起见，只需在客户端使用HTML表单，并将

enctype

设置为

multipart/form data

。在服务器端，假设您使用的是Node.js，只要您使用

multer

中间件解析表单数据，就可以在

请求中找到上载的文件。就是这样。
您需要将该文件附加到formData，然后将其发送到服务器

Javascript:

var formData = new FormData();
        jQuery.each(jQuery('#fileUpload')[0].files, function (i, file) {
            formData.append('file', file);
        });

$.ajax({
            type: 'POST',
            url: //To your route eg: /saveImage,
            data: formData,
            contentType: false,
            processData: false,
            success: function (result) {
                if (result.status != 0) {
                    console.log(result.message)
                    return;
                }
                console.log(result.message)
            }
        });

现在在您的路线上使用
multer

节点

var multer = require('multer')
var path = require("path");

// Check for extension of image
const getExtension = file =>{
    if (file.mimetype == "image/jpeg")
        ext =  ".jpeg"
    else
        ext =".png"
    return ext;
}

//initialize multer
var storage = multer.diskStorage({ 
    destination: function (req, file, cb) {
        cb(null, path.join(__dirname, '../public/images'))
    },
    filename: function (req, file, cb) {
        cb(null, file.fieldname + '-' + Date.now() + getExtension(file))
    }
 })
 var upload = multer({storage:storage})

router.post('/saveImage', upload.single('file'), (req, res, next)=>{
    if (req.file && req.file.mimetype != 'image/jpeg' && req.file.mimetype != 'image/png') 
        return res.json({
            status:1,
            message:"Please Choose JPG or PNG images"
        })
if(req.file){
            let iamge = "/images/" + req.file.filename
res.json({
            status:0,
            message:"Successfully saved",
            path : image
        })
        }
})

如果我没有req.body，我会看到我正在发布的对象，但是我如何访问请求中发送的文件呢？谢谢访问该文件是什么意思？听起来很傻，但这是在index.js中还是在Ajax代码中？感谢表单数据，它将进入一个文本，对于节点，您可以参考multer链接
var multer = require('multer')
var path = require("path");

// Check for extension of image
const getExtension = file =>{
    if (file.mimetype == "image/jpeg")
        ext =  ".jpeg"
    else
        ext =".png"
    return ext;
}

//initialize multer
var storage = multer.diskStorage({ 
    destination: function (req, file, cb) {
        cb(null, path.join(__dirname, '../public/images'))
    },
    filename: function (req, file, cb) {
        cb(null, file.fieldname + '-' + Date.now() + getExtension(file))
    }
 })
 var upload = multer({storage:storage})

router.post('/saveImage', upload.single('file'), (req, res, next)=>{
    if (req.file && req.file.mimetype != 'image/jpeg' && req.file.mimetype != 'image/png') 
        return res.json({
            status:1,
            message:"Please Choose JPG or PNG images"
        })
if(req.file){
            let iamge = "/images/" + req.file.filename
res.json({
            status:0,
            message:"Successfully saved",
            path : image
        })
        }
})