Category Archives: Express

It’s easy for us to store/ get data in mongoDB using nodejs through POST and GET Api methods.. when comes to store an image.. it’s different as of storing normal fields data.. while i was trying to store and read the image , it faced it bit tough..

So this post shows you the easy and understandable way of storing and getting the image from MongoDB using nodejs, Express, and Mongoose..

The way i am trying to store the image is like.. i am uploading and storing the image in my project directory(uploads) and using the image path to get store in Mongo collection.. while getting the image, getting the image path from mongoDB and referring it to get the exact image..

My project structure looks like :

node1

  • Uploads is the directory which stores images/files we upload..
  • routes has the class ‘imagefile.js’ which contains the logic of image/file store and get
  • views has the class ‘index,ejs’ which contains Html upload logic
  • app.js is the main class
  • package.json has the information about the packages installed

The code inside the files is as follows :

package.json


{
"name": "my-nodejs-api",
"version": "1.0.0",
"description": "simple api app",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"dependencies": {
"express":"*",
"body-parser":"*",
"mongoose":"*",
"multer":"*",
"path":"*"
},
"author": "Kamran Athar",
"license": "ISC"
}

app.js 


var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var mongoose = require('mongoose');
var path = require('path');
app.use(bodyParser.json());

//To get the access for the functions defined in index.js class
var routes = require('./routes/imagefile');

// connect to mongo,
//i have created mongo collection in mlab.com.. the below is my database access url..
//So make sure you give your connection details..
mongoose.connect('mongodb://nodejsapi:nodejsapi@ds041516.mlab.com:41516/mynodejsapp');

app.use('/', routes);

//URL : http://localhost:3000/images/
// To get all the images/files stored in MongoDB
app.get('/images', function(req, res) {
//calling the function from index.js class using routes object..
routes.getImages(function(err, genres) {
if (err) {
throw err;

}
res.json(genres);

});
});

// URL : http://localhost:3000/images/(give you collectionID)
// To get the single image/File using id from the MongoDB
app.get('/images/:id', function(req, res) {

//calling the function from index.js class using routes object..
routes.getImageById(req.params.id, function(err, genres) {
if (err) {
throw err;
}
//res.download(genres.path);
res.send(genres.path)
});
});

app.listen(3000);

console.log('Running on port 3000');

index.ejs


<html>
<head>
 <title>test</title>
</head>
<body>
<form action "/" method="POST" enctype="multipart/form-data">
 <input type="file" name="myimage" ></input>
 <input type="submit" name="submit" value="submit"></input>
</form>
</body>
</html>

imagefile.js


var express = require('express');
var router = express.Router();
var multer = require('multer');
var mongoose = require('mongoose');

//path and originalname are the fields stored in mongoDB
var imageSchema = mongoose.Schema({
 path: {
 type: String,
 required: true,
 trim: true
 },
 originalname: {
 type: String,
 required: true
 }

});


var Image = module.exports = mongoose.model('files', imageSchema);

router.getImages = function(callback, limit) {

 Image.find(callback).limit(limit);
}


router.getImageById = function(id, callback) {
 
 Image.findById(id, callback);

}

router.addImage = function(image, callback) {
 Image.create(image, callback);
}


// To get more info about 'multer'.. you can go through https://www.npmjs.com/package/multer..
var storage = multer.diskStorage({
 destination: function(req, file, cb) {
 cb(null, 'uploads/')
 },
 filename: function(req, file, cb) {
 cb(null, file.originalname);
 }
});

var upload = multer({
 storage: storage
});

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

router.post('/', upload.any(), function(req, res, next) {

 res.send(req.files);

/*req.files has the information regarding the file you are uploading...
from the total information, i am just using the path and the imageName to store in the mongo collection(table)
*/
 var path = req.files[0].path;
 var imageName = req.files[0].originalname;

 var imagepath = {};
 imagepath['path'] = path;
 imagepath['originalname'] = imageName;

 //imagepath contains two objects, path and the imageName

 //we are passing two objects in the addImage method.. which is defined above..
 router.addImage(imagepath, function(err) {

 });

});

module.exports = router;

URL's to use :
http://localhost:3000/   : Html page which shows the button to upload.. and submitting it store the image/ file in project directory and then image path in MongoDB
http://localhost:3000/images : to get All images/files from the MongoDB
http://localhost:3000/images/(mongo collection ID) : To get path of single image