Question

我正拼命地尝试在node-js中构建一个图库，我可以： 1.使用表单从硬盘上传图像 2.将上传的文件保存在mongo-DB（mongoose）中 3.检索上传的图像并将其显示在我的网站上

我对node和mongodb都很陌生，所以我很难做到这一点（对于简单的新闻/纯文本db-schemas来说，这样做很容易）。我以前搜索过所有类似的主题，但是没有一个能帮助我，所以我现在非常绝望，因为我必须复制一些我在解决它的过程中不了解的代码部分。请帮我一些初学者的解释！

我的html表单

        <form id="uploadForm" action="/images" method="POST" enctype="multipart/form-data">
        <div class="form-group">
            <label for="imageSelector">Select Image</label>
            <input type="file" class="form-control" name="image" placeholder="upload image" id="imageSelector" accept="image/png, image/jpeg">
        </div>
        <div class="form-group imagePreview">
            <p>No files currently selected for upload</p>
        </div>
        <div class="form-group">
            <label for="imageDescription">Image Description</label>
            <input type="text" class="form-control" name="description" placeholder="description" id="imageDescription">
        </div>
            <button class="btn btn-success">submit</button>
    </form>

我的DB-Schema：

let imageSchema = new mongoose.Schema({
img:  { data: Buffer, contentType: String },
description: String});

module.exports = mongoose.model("Image", imageSchema); //Exporting my Schema

我的路线档案：

let express = require("express");
let mongoose = require("mongoose");
let bodyParser = require("body-parser");
let router = express.Router({mergeParams: true});
let multer  = require("multer");

let Image = require("../models/image"); //Using DB-Schema that I exported

const GridFsStorage = require('multer-gridfs-storage');

const storage = new GridFsStorage({
  url: "mongodb://localhost/My_DB",
  file: (req, file) => {
    return {
      filename: 'file_' + Date.now()
    };
  }
});

const upload = multer({ storage });
const sUpload = upload.single('image');


router.post('/', sUpload, (req, res, next) => { 
    console.log("FILENAME: " + req.file.filename);
    console.log("CHUNKSIZE: " + req.file.chunkSize);
    console.log("CONTENTTYPE: " + req.file.contentType);
    Image.create(req.file, function(err, addedImage) {
        if(err) {
            console.log(err);
        } else {
            console.log("SUCCESSFULLY ADDED NEW IMAGE! " + addedImage);
            res.redirect("/images");
        }
    })

});

module.exports = router;

现在，我需要做些什么来获取实际文件来检索它？当我加载我的html表单并上传图片时，点击提交后，我得到以下console.logs：

FILENAME: file_1522841638818
CHUNKSIZE: 261120
CONTENTTYPE: image/png
PATH: undefined
ADDED NEW IMAGE SUCCESSFULLY! { _id: 5ac4b82674d2091a8db36f2f, __v: 0 }

当我去我的DB＆＃34; My_DB＆＃34;并查看db.images.find（）图像是否未上传。所以我需要知道 1.如何将其上传到我的数据库？ 2.如何检索它并真正使用文件本身在html中显示它？

非常感谢！

顺便说一下：我实现了整个multer-gridfs-storage的东西，因为我红了，你无法上传图片＆gt;没有它的16 MB。我想我还没有真正使用multer所以也许你可以给我一些关于如何获取图像文件的提示。我知道，您可能会谈论我实施的特定包的一些文档。相信我，这只是大约100种不同尝试的尝试，我现在真的很困惑对我来说很重要： - /

Answer 1

使用

var storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, '/tmp/my-uploads')
  },
  filename: function (req, file, cb) {
    cb(null, file.fieldname + '-' + Date.now())
  }
})

var upload = multer({ storage: storage })

Url：文件系统路径不是mongo路径您的模型还需要数据，内容类型，描述字段

    img:  { 
      data: Buffer, 
      contentType: String },
     description: String});

但是req.file不包含在同一个键上，所以请使用键映射创建新的json

更多信息：https://github.com/expressjs/multer

Answer 2

要将图像存储到mongoDB，您需要在链接https://devdactic.com/ionic-image-upload-nodejs-server/

中编写类似的服务

图像上传平台使用node-js，mongoose和multer

2 个答案: