Create File Upload rest API NodeJs using NPM Package  MULTER. We are using NPM package multi and upload file like an image, doc, pdf, zip etc..I am uploading the only image you can upload other files.

Project Structure :

Project Name                        // Project directory
   - node_modules                // Npm Package
   -  package-lock.json.         // package-lock.json
   -  package.json                 // package.json
   -  server.js                        // server.js file
   -  Public                           // Html View and Angualrjs file

Create a new Directory, we can run the following command: 

mkdir <directoryname>

Then move into the newly created directory:

cd <directoryname>

then  run this command : 

npm init

and fill this information like that :

package name: (directoryname)
version: (1.0.0)
description:
entry point: (index.js) server.js
test command:
git repository:
keywords:
author:
license: (ISC)
{"name": "curlapi",  "version": "1.0.0","description": "", "main": "server.js","scripts": { "test": "echo \"Error: no test specified\" && exit 1" },  "author": "",  "license": "ISC"}Is this ok? (yes) yes then enter

After creating project install node package run command:

npm install --save express morgan body-parser method-override multer fs

create the server.js file and add this code :

// set up ========================
var express  = require('express');
var app      = express();                               // create our app w/ express
var morgan = require('morgan');             // log requests to the console (express4)
var mongoose = require('mongoose');
var bodyParser = require('body-parser');    // pull information from HTML POST (express4)
var methodOverride = require('method-override');
var multer  =   require('multer');
var fs = require("fs");

app.use(function(req, res, next) { //allow cross origin requests
    if (req.method === 'OPTIONS') {
        console.log('!OPTIONS');
        var headers = {};
        headers["Access-Control-Allow-Origin"] = "*";
        headers["Access-Control-Allow-Methods"] = "POST, GET, PUT, DELETE, OPTIONS";
        headers["Access-Control-Allow-Credentials"] = false;
        headers["Access-Control-Max-Age"] = '86400'; // 24 hours
        headers["Access-Control-Allow-Headers"] = "X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept";
        res.writeHead(200, headers);
        res.end();
    }
    res.setHeader("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "POST, PUT, OPTIONS, DELETE, GET");
    res.header("Access-Control-Max-Age", "3600");
    res.header("Access-Control-Allow-Headers", "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");
    next();
});

// configuration
app.use(express.static(__dirname + '/public'));                 // set the static files location /public/img will be /img for users
app.use('/public/uploads',express.static(__dirname + '/public/uploads'));
app.use(morgan('dev'));                            // parse application/json
app.use(bodyParser.json({ type: 'application/vnd.api+json' })); // parse application/vnd.api+json as json

// file upload code
var storage = multer.diskStorage({ //multers disk storage settings
    destination: function (req, file, cb) {
        cb(null, './public/uploads/')
    },
    filename: function (req, file, cb) {
        // console.log(file);
        var datetimestamp = Date.now();
        cb(null, file.fieldname + '-' + datetimestamp + '.' + file.originalname.split('.')[file.originalname.split('.').length -1])
    }
});

var uploadMultiple = multer({ //multer settings
        storage: storage
    }).array('file',20);

var uploadSingle = multer({ //multer settings
        storage: storage
    }).single('file');

app.get('*', function(req, res) {
    res.sendfile('./public/index.html'); // load our public/index.html file
});

/** API for single file upload */
app.post('/api/uploadPhoto', function(req, res) {
    uploadSingle(req,res,function(err){
        if(err){
             res.json({error_code:1,err_desc:err});
             return;
        }
         res.json(req.file);
    })
});

/** API for single file upload */
app.post('/api/uploadPhotos', function(req, res) {
    uploadMultiple(req,res,function(err){
        if(err){
            console.log(err);
             res.json({error_code:1,err_desc:err});
             return;
        }

        res.json(req.files);
    })

});

app.listen(process.env.PORT || 9000, function(){console.log("App listening on port 9000");});

Forent side  Code Link 

http://codesolution.co.in/detail/post/angularjs-file-uploading-using-ajax--nodejs-rest-api-and-file-upload-java-script-file

Github Link: 

https://github.com/Sudarshan101/FileuploadNodejsAngularjs

See Demo: 

https://www.youtube.com/watch?v=yQ_iYzFqg9A?

About the author
Code solution

info@codesolution.co.in

Discussion
  • 0 comments

Add comment To Login
Add comment