add multer to add files to the app

Author: harsh1206

controllers/users_controller.js

@@ -1,4 +1,8 @@
-const User=require('../models/user')
+const User=require('../models/user');
+const fs=require('fs');
+const path=require('path');
+
+
 
 module.exports.profile = function(req, res){
     User.findById(req.params.id,function(err,user){
@@ -11,17 +15,59 @@ module.exports.profile = function(req, res){
 };
 
 
-module.exports.update=function(req,res){
+module.exports.update=async function(req,res){
 
-    if(req.user.id==req.params.id)
-    {
-        User.findByIdAndUpdate(req.params.id,req.body,function(error,user){
+    // if(req.user.id==req.params.id)
+    // {
+    //     User.findByIdAndUpdate(req.params.id,req.body,function(error,user){
 
-            return res.redirect('back');
+    //         return res.redirect('back');
+
+    //     });
+    // }else{
+    //     return res.status(401).send('Unauthroized'); 
+    // }
+
+
+
+    if(req.user.id==req.params.id)
+    { 
+          try{
+
+            let user= await User.findById(req.params.id);
+            User.uploadedAvatar(req,res,function(err){
+                 
+                if(err){
+                    console.log('****Multer error !',err);
+                }
+
+                user.name=req.body.name;
+                user.email=req.body.email;
+
+                if(req.file){
+
+
+                    if(user.avatar){
+                     
+                        fs.unlinkSync(path.join(__dirname,'..',user.avatar));
+
+                    }
+
+                    // this is saving the path of the uploaded file into the avatar field in the user
+                    user.avatar=User.avatarPath+'/'+req.file.filename;
+                }
+                user.save();
+                return res.redirect('back');
+            });    
 
-        });
+          } catch(err){
+              req.flash('error',err);
+              return res.redirect('back');
+          } 
+                
     }else{
-        return res.status(401).send('Unauthroized'); 
+        req.flash('error','Unauthorized!');
+        return res.status(401).send('Unauthroized');
     }
 
 }

index.js

@@ -12,7 +12,7 @@ const MongoStore=require('connect-mongo')(session);
 const sassMiddleware=require('node-sass-middleware');
 const flash = require('connect-flash');
 const customMware=require('./config/middleware');
-const multer=require('multer');
+// const multer=require('multer');
 
 
 app.use(sassMiddleware({
@@ -30,6 +30,8 @@ app.use(express.urlencoded());
 app.use(cookieParser());
 
 app.use(express.static('./assets'));
+// make the uploads path availaible to the browser
+app.use('/uploads',express.static(__dirname+'/uploads'));
 
 app.use(expressLayouts);
 // extract style and scripts from sub pages into the layout

models/user.js

@@ -1,5 +1,10 @@
 const mongoose=require('mongoose');
 
+// import multer
+const multer=require('multer');
+const path=require('path');
+const AVATAR_PATH=path.join('/uploads/users/avatars');
+
 const userSchema=new mongoose.Schema({
 
     email:{
@@ -16,6 +21,9 @@ const userSchema=new mongoose.Schema({
 
         type:String,
         required:true
+    },
+    avatar:{
+          type:String
     }
 
 }, {
@@ -24,6 +32,20 @@ const userSchema=new mongoose.Schema({
 
 });
 
+var storage = multer.diskStorage({
+    destination: function (req, file, cb) {
+      cb(null,path.join(__dirname,'..',AVATAR_PATH));
+    },
+    filename: function (req, file, cb) {
+      cb(null, file.fieldname + '-' + Date.now());
+    }
+});
+
+// static functions
+userSchema.statics.uploadedAvatar=multer({storage: storage}).single('avatar');
+userSchema.statics.avatarPath=AVATAR_PATH;
+
+
 const User=mongoose.model('User',userSchema);
 
 module.exports=User;

uploads/users/avatars/avatar-1597752086140

@@ -1,17 +1,17 @@
         <link rel="stylesheet" href="/css/user_profile.css">
-        <h1>
-            Codeial / Profile Page
-        </h1>
+        
+        <img src="<%= user.avatar %>" alt="<%= user.name %>" width="100">
 
 
 
         <% if(user.id==profile_user.id) {%>
             
             <!-- if user matches show the form -->
-            <form action="/users/update/<%= profile_user.id %>" method="POST">
+            <form action="/users/update/<%= profile_user.id %>" enctype="multipart/form-data" method="POST">
              
                <input type="text" name="name" placeholder="Your name" value="<%= profile_user.name %>" required> 
                <input type="email" name="email" placeholder="Your email" value="<%= profile_user.email %>" required> 
+                <input type="file" name="avatar" placeholder="Profile Picture">
                <input type="submit" value="update">
             </form>