本文给大家分享一个关于Node+Mongodb的附件上传下载的项目，这个项目比较简单，看完的同学就可以很快的搭建一个小网盘或者图床了。

首先我们得先去了解一下Mongodb的文件储存（GridFS）是啥，因为我们都是基于 GridFS 来进行文件储存

了解了大概概念后就可以着手安装我们必须的插件了

（推荐教程：Node入门）

以上就是我们需要准备的东西了

npm install express body-parser ejs gridfs-stream method-override mongoose multer multer-gridfs-storage // or yarn add express body-parser ejs gridfs-stream method-override mongoose multer multer-gridfs-storage

// 可自行补充信息 // npm init

然后在根目录新建一个入口文件app.js,和页面 views/index.ejs

将我们安装的包引入，再跑跑看看

const express = require('express') const path = require('path') const crypto = require('crypto') const mongoose = require('mongoose') const multer = require('multer') const GridFsStorage = require('multer-gridfs-storage') const GridFsStream = require('gridfs-stream') const methodOverride = require('method-override') const bodyParser = require('body-parser')

一般来说启动了app.js的话我们在浏览器访问 http://localhost:5000 就能看到 views/index.ejs 中的界面了，如果没有，自行查看控制台是否报错

我这边用的本地mongodb数据库，线上也是一样的，我们可以用NoSQL manager for mongdb来查看我们数据库里面的数据，我们新建一个新的集合，我这边叫 grid_uploads。所以连接的话也是连接这个集合

// 数据库的链接 const mongoURL = 'mongodb://localhost:27017/grid_uploads'

可以尝试在NoSQL写入一些数据，具体使用可以参考博客【MongoDB】NoSQL Manager for MongoDB 教程

作为一个小两年的前端工程师，已经练就了像素眼了，我们肯定不能把界面做的辣么丑对吧，眼睛过不去啊，所以我们简单的用bootstrap4来做个界面好了

那么我们请求 http://localhost:5000 的话我们看到的应该是这样子的

（推荐教程：Node.js教程）

// 定义gfs变量，后续我们进行数据库文件操作的时候可不能少 let gfs; connect.once('open', () => { // 监听数据库开启，通过 gridfs-stream 中间件和数据库进行文件的出入控制 gfs = GridFsStream(connect.db, mongoose.mongo) gfs.collection('upload') // 它会在我们数据库中建立 upload.files(记录文件信息) upload.chunks(存储文件块) })

app.post('/upload', upload.single('file'), (req, res) => { res.redirect('/') })

看起来简简单单，请记着这么几件事

（推荐微课：Node.js微课）

这是upload.chunks

这是upload.files

获取我们所有的文件

app.get('/files', (req, res) => { // 通过查找返回一个数组对象回去 gfs.files.find().toArray((err, files) => { if (!files || files.length === 0) { return res.status(404).json({ err: '文件不存在！' }) } return res.json(files) }) })

我们可以进行一些美化操作，比如我们可以将上传是图片的，返回到界面的话以图片显示，其他则以 a 标签的格式显示（可点击下载），所以我们可以将 views/index.ejs的界面进行美化改造（ejs语法用起来确实蛮麻烦的），进行重新排版以及添加删除按钮

文件不存在

（推荐教程：MongoDB教程）

要将 ejs 中的files变量获取到我们应该重写一下 get('/')接口，使其在访问localhost:5000的时候先去读取一下数据库文件信息并输出到页面中去

app.get('/', (req, res) => { gfs.files.find().toArray((err, files) => { if (!files || files.length === 0) { res.render('index', { files: false }) return } files.map(file => { // 如果是以下图片类型我们就在前端展示出来，其余一律按附件处理，通过 isImage 来区分图片和非图片 const imageType = ['image/png', 'image/jpg', 'image/gif', 'image/jpeg'] if (imageType.includes(file.contentType)) { file.isImage = true } else { file.isImage = false } }) res.render('index', { files: files }) }) })

完成上述的情况我们访问首页的话就行该是如下情况

在这里我们通过a标签访问 /download/:filename 接口，filename是文件名，当然可以用其他的比如_id，当查找到有该附件的时候就将它合并成可读留，通过管道返回，这样在前端界面上点击文件标题就可以直接下载了

app.get('/download/:filename', (req, res) => { gfs.files.findOne({ filename: req.params.filename }, (err, file) => { if (!file) { return res.status(404).json({ err: '文件不存在！' }) } const readstream = gfs.createReadStream(file.filename) readstream.pipe(res) }) })

在这里我们通过a标签访问 /files/:id 接口，id对应，点击删除按钮，就直接删除了，并重定向到首页

app.delete('/files/:id', (req, res) => { gfs.remove({ _id: req.params.id, root: 'upload' }, (err) => { if (err) { return res.status(404).json({ err: '删除的文件不存在！' }) } res.redirect('/') }) })

由于我们一直用form做请求，但是form表单没有delete请求方式，所以我们用到了method-override插件，当然要是用Ajax就没关系了，我们项目毕竟速成嘛，主要看效果和过程。

（推荐微课：MongoDB入门与案例分析）

简简单单的告一段落了，学了的小伙伴们可以尝试更加深入的操作，所以我们就可以用此项目来做一个图床或者小网盘盘，还是简简单单滴。当然该附件上传也有一定的限制问题，比如大文件可能上传时间更久，我们就需要采用文件分片方式上传了。

以上就是个关于如何使用用Node+MongoDB搭建简单的图床或者网盘的相关介绍了，希望对大家有所帮助。