การอัพโหลดไฟล์ด้วย Multer ใน Express สำหรับ ระบบสมาชิก

npm install multer --save

const multer = require('multer') // ใช้งาน Multer Module

// จะทำการอัพโหลดไปยังโฟลเดอร์ uploads ที่ root (เราต้องสร้างโฟลเดอร์ นี้ก่อนเรียกใช้งาน)
// การกำหนดโฟลเดอร์ จะอ้างอิงตำแหน่ง จาก root นั่นคือ เราไม่ต้องกำหนด path แบบ relative 
// เช่น ไม่ต้องกำหนดเป็น '../uploads/

let upload = multer({ dest: 'uploads/' })

app.post(upload.single('avatar'), (req, res, next) => {})

upload.single('ชื่อฟิลด์ input file')

<form action="/profile" method="post" enctype="multipart/form-data">
  <input type="file" name="avatar" />
</form>

app.post(upload.single('avatar'), (req, res, next) => {})

// เรียกใช้ไฟล์จากตัวแปร req.file 

upload.array('ชื่อฟิลด์ input file', [จำนวนไฟล์อัพโหลด สูงสุดไม่เกิน])

<form action="/gallery" method="post" enctype="multipart/form-data">
  <input type="file" name="photos" multiple />
</form>

// จำนวนไฟล์สูงสุด จะกำหนดหรือไม่ก็ได้ 
// จำนวนไฟล์สูงสุดไม่เกิน 4 หมายความว่า ในฟอร์มด้านบน สามารถเลือกไฟล์ได้สูงสุดไม่เกิน 4
// อาจจะไม่อัพโหลด หรือ อัพโหลดแค่ 2 ไฟล์ได้ แต่จะเลือกอัพโหลดพร้อมกัน 5 ไฟล์ไม่ได้

app.post(upload.array('photos', 4), (req, res, next) => {})

// เรียกใช้ไฟล์จากตัวแปร req.files  เช่น
// req.files['photos'][0]...req.files['photos'][3]

upload.fields([
	{ name: 'ชื่อฟิลด์ input file', maxCount: จำนวนสูงสุด }, 
	{ name: 'ชื่อฟิลด์ input file', maxCount: จำนวนสูงสุด },
])

<form action="/home" method="post" enctype="multipart/form-data">
    <input type="file" name="photos" multiple />
    <input type="file" name="cover" multiple /> 
</form>

app.post(upload.fields([
	{ name: 'photos', maxCount: 1 }, 
	{ name: 'cover', maxCount: 2 }
]), (req, res, next) => {})

// เรียกใช้ไฟล์จากตัวแปร req.files  เช่น
// req.files['photos'][0]
// req.files['cover'][0] , req.files['photos'][1]

upload.any()

<form action="/home" method="post" enctype="multipart/form-data">
    <input type="file" name="photos" multiple />
    <input type="file" name="cover" /> 
</form>

app.post(upload.any(), (req, res, next) => {})

// เรียกใช้ไฟล์จากตัวแปร req.files  เช่น
// req.files['photos'][0]...req.files['photos'][n]
// req.files['cover'][0]

upload.none()

app.post(upload.none(), (req, res, next) => {})

// ใช้ได้เฉพาะข้อมูลจากฟอร์ม ที่ไม่ใช่ input file ผ่าน req.body
// ห้ามอัพโหลดไฟล์ ไม่สามารถใช้งาน req.file หรือ req.files ได้

{ 
	fieldname: 'cover', // ชื่อฟิลด์ input file
	originalname: 'water.jpg', // ชื่อไฟล์ต้นฉบับที่อัพโหลด
	encoding: '7bit', // ประเภท encoding ของไฟล์
	mimetype: 'image/jpeg', // Mime type ของไฟล์ ตัวระบุประเภทไฟล์ เช่น ไฟล์รูป
	destination: 'uploads/avatar/', // โฟลเดอร์ที่เก็บไฟล์ที่อัพโหลด
	filename: 'c544023062d5ab27d60cb0e6c0ecf5e3', // ชื่อไฟล์ที่บันทึก 
	path: 'uploads\\avatar\\c544023062d5ab27d60cb0e6c0ecf5e3', // path ไฟล์ที่บันทึก
	size: 2538505 // ขนาดไฟล์ หน่วย bytes
}

multer(opts)

// ตัวอย่างเช่น 
// let upload = multer({ dest: 'uploads/' })

• dest | storage กำหนดที่สำหรับเก็บไฟล์ที่อัพโหลด
• fileFilter ฟังก์ชันสำหรับตรวจสอบ และกำหนดประเภทไฟล์ที่อนุญาต
• limits กำหนดข้อจำกัดต่างๆ ของไฟล์ที่อัพโหลด
• preservePath ให้คง path เต็มไว้ แทนการใช้งาน แค่ชื่อไฟล์

let upload = multer({ 
    dest: 'uploads/avatar/', // กำหนดโฟลเดอร์ที่จะเก็บไฟล์
    fileFilter:(req, file, cb)=>{
		// ถ้าไม่ใช่ไฟล์รูปภาพ
        if (!file.mimetype.match(/\/(jpg|jpeg|png|gif)$/)) { // ตรวจสอบชนิดไฟล์
            return cb(new Error('เฉพาะไฟล์รูปภาพเท่านั้น!'), false)
        }
        cb(null, true) // ถ้าเป็นไฟล์รูปภาพ ผ่านเงื่อนไขการตรวจสอบประเภทไฟล์
    },
    limits:{
        fileSize:2000000 // กำหนดขนาดไฟล์ไม่เกิน 2 MB = 2000000 bytes
    }
})

let upload = multer({ 
    storage:multer.diskStorage({
        destination: function (req, file, cb) {
			// ใช้งาน path module กำหนดโฟลเดอร์ที่จะบันทึกไฟล์
            cb(null, path.join(__dirname,'..','uploads/avatar'))
        },
        filename: function (req, file, cb) {
			// เปลี่ยนชื่อไฟล์ ในที่นี้ใช้เวลา timestamp ต่อด้วยชือ่ไฟล์เดิม
			// เช่นไฟล์เดิมเป็น bird.png ก็จะได้เป็น  1558631524415-bird.png
            cb(null, Date.now() + '-' + file.originalname)
        }
    }),
    fileFilter:(req, file, cb)=>{
		// ถ้าไม่ใช่ไฟล์รูปภาพ
        if (!file.mimetype.match(/\/(jpg|jpeg|png|gif)$/)) { // ตรวจสอบชนิดไฟล์
            return cb(new Error('เฉพาะไฟล์รูปภาพเท่านั้น!'), false)
        }
        cb(null, true) // ถ้าเป็นไฟล์รูปภาพ ผ่านเงื่อนไขการตรวจสอบประเภทไฟล์
    },
    limits:{
        fileSize:2000000 // กำหนดขนาดไฟล์ไม่เกิน 2 MB = 2000000 bytes
    }
})

path.join(__dirname,'..','uploads/avatar')

step 1 = __dirname จะได้ C:\projects\expressjs\routes
step 2 = .. จะได้ C:\projects\expressjs\
step 3 = uploads/avatar จะได้ C:\projects\expressjs\uploads/avatar

cb(null, file.originalname) // ใช้ชื่อไฟล์ตามต้นฉบับ ซื่ออาจซ้ำกัน หากซ้ำกัน จะทับไฟล์เดิม

let extArr = file.originalname.split('.')
let ext = extArr[extArr.length-1]
cb(null, Date.now() + '.' + ext)

fileFilter:(req, file, cb)=>{
	// ถ้าไม่ใช่ไฟล์รูปภาพ
	if (!file.mimetype.match(/\/(jpg|jpeg|png|gif)$/)) { // ตรวจสอบชนิดไฟล์
		return cb(new Error('เฉพาะไฟล์รูปภาพเท่านั้น!'), false)
	}
	cb(null, true) // ถ้าเป็นไฟล์รูปภาพ ผ่านเงื่อนไขการตรวจสอบประเภทไฟล์
}

• fieldNameSize ความยาวชื่อฟิลด์ ค่าเริ่มต้น ไม่เเกิน 100 bytes (ประมาณ 100 ตัวอักษร)
• fieldSize ขนาดค่าของฟิลด์ สูงสุด ค่าเริ่มต้น 1MB
• fields จำนวนฟิลด์ที่ไม่ใช่ input file ค่าเริ่มต้นคือไม่จำกัด
• fileSize ขนาดไฟล์ที่จะอัพโหลดต่อ 1 ไฟล์ (หน่วย bytes) ค่าเริ่มต้นคือไม่จำกัด
• files จำนวนฟิลด์ input file สูงสุด ค่าเริ่มต้นคือไม่จำกัด
• parts จำนวน path สูงสุด (fields + files) ค่าเริ่มต้นคือไม่จำกัด
• headerPairs จำนวนสูงสุดของ header ค่า key=>value ที่จับคู่กัน ค่าเริ่มต้น 2000

limits:{
	fileSize:20000000,
	fieldSize:2 // 2MB
}

let upload = multer({ dest: 'uploads/avatar/' })

app.post('/profile', upload.single('avatar'), function (req, res) { 
    //  
})

let upload = multer({ dest: 'uploads/avatar/' }).single('avatar')

app.post('/profile', function (req, res) {
	upload(req, res, function (err) {
		if (err instanceof multer.MulterError) {
		  // ไม่ผ่านเงื่อนไขการอัพโหลดไฟล์
		} else if (err) {
		  // ไม่ผ่านเงื่อนไขอื่นๆ 
		}
		
		// ผ่านเงื่อนไข อัพโหลดไฟล์ได้ปกติ
	})
})

Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryvnP2DBb8vx7JcXlW

<nav class="text-center">
<!-- THIS IS NAV <br> -->
<? if(!session.isLogined || session.isLogined == false){ ?>
<a href="/login">Login</a> | <a href="/register">Register</a>
<? }else{ ?>
    <a href="/me">Dashboard</a> |
    <a href="/profile">Profile</a> |    
    <a href="/changepassword">Change Password</a> |
    <a href="/me/logout">Logout</a>
<? } ?>
</nav>

const Joi = require('@hapi/joi')

const validation = (schema) =>{
    return ((req, res, next) => {
        // ทำการตรวจสอบความถูกต้องของข้อมูล req.body ที่ส่งมา
        Joi.validate(req.body, schema, function (error, value) {
            // กรณีเกิด error ข้อมูลไม่ผ่านการตรวจสอบ 
            if(error) {
                res.locals.errors = {
                    "message": error.details[0].message
                }
                res.locals.user = req.body
                return res.render(req.renderPage)
            } 
            if(!error) next()
        })  
    })
}

// ฟังก์ชั่นตรวจสอบข้อมูล กรณีใช้งานร่วมกับ multipart/form-data
// ใช้งานรูปแบบ cb (callback ฟังก์ชั่น)
const validationFormData = (schema, req, cb)=>{
    return Joi.validate(req.body, schema, function (error, value) {
        // กรณีเกิด error ข้อมูลไม่ผ่านการตรวจสอบ 
        if(error) { 
            cb(error.details[0].message, false)
        } 
        if(!error) cb(null, true)
    })  
}

// กำหนดชุดรูปแบบ schema
const schema = {
    register : Joi.object().keys({
        name: Joi.string().min(3).max(30).required(),
        email: Joi.string().email({ minDomainSegments: 2 }).required(),
        password:Joi.string().min(6).max(15).required(),
        confirm_password: Joi.any().valid(Joi.ref('password')).required()
            .error(errors => {return{ message:'ยืนยันรหัสผ่านไม่ถูกต้อง กรุณาลองใหม่'}}),
        _csrf:Joi.any()
    }),
    login : Joi.object().keys({
        email: Joi.string().email({ minDomainSegments: 2 }).required(),
        password:Joi.string().min(6).max(15).required(),
        remember:Joi.any(),

        _csrf:Joi.any()
    }),
    changepassword : Joi.object().keys({
        password:Joi.string().min(6).max(15).required(),
        confirm_password: Joi.any().valid(Joi.ref('password')).required()
            .error(errors => {return{ message:'ยืนยันรหัสผ่านไม่ถูกต้อง กรุณาลองใหม่'}}),
        _csrf:Joi.any()
    }),    
    profile : Joi.object().keys({
        name: Joi.string().min(3).max(30).required(),
        h_avatar:Joi.any()
    })  
}

module.exports = { validation, validationFormData, schema }

const db = require('../config/db')
const bcrypt = require('bcrypt') // ใช้งาน bcrypt module
const saltRounds = 10 // กำหนดค่า salt

const Users = {
    email_exists:((req, res) => {
        return new Promise((resolve, reject)=>{
            res.locals.user = req.body        
            db.then((db)=>{ 
                db.collection('users') 
                .find({
                    email:req.body.email
                })
                .toArray( (error, results) => {
                    if(!error){
                        if(results.length==0){
                            resolve(true)
                        }else{
                            reject('อีเมลนี้ถูกใช้งานแล้ว')
                        }
                    }else{
                        reject('เกิดข้อผิดพลาด กรุณาลองใหม่')
                    }
                })
            })
        })
    }),
    login:((req, res) => {
        return new Promise((resolve, reject)=>{
            res.locals.user = req.body        
            db.then((db)=>{ 
                db.collection('users') 
                .find({
                    email:req.body.email
                })
                .toArray( (error, results) => {
                    if(!error){
                        if(results.length > 0){
                            let hash = results[0].password
                            let password = req.body.password
                            bcrypt.compare(password, hash).then((result)=>{
                                if(result == true) resolve(results)
                                if(result == false) reject('รห้สผ่านไม่ถูกต้อง กรุณาลองใหม่')
                            })                            
                        }else{
                            reject('อีเมล หรือ รห้สผ่านไม่ถูกต้อง กรุณาลองใหม่')
                        }
                    }else{
                        reject('เกิดข้อผิดพลาด กรุณาลองใหม่')
                    }
                })
            })            
        })
    }),
    register:((req, res) => {
        return new Promise((resolve, reject)=>{
            res.locals.user = req.body   
            db.then((db)=>{  
                db.collection('lastid')  
                .findOneAndUpdate({id:1},
                { $inc: { user_id: 1 }},(error, results)=>{ 
                    if(!error){
                        let password = req.body.password
                        bcrypt.hash(password, saltRounds).then((hash)=>{
                            let insertID = results.value.user_id+1
                            let user = {
                                "_id": insertID, 
                                "name": req.body.name, 
                                "email": req.body.email, 
                                "password": hash
                            }            
                            db.collection('users')
                            .insertOne(user, (error, results) => { 
                                if(!error){
                                    resolve(results)
                                }else{
                                    reject('เกิดข้อผิดพลาด กรุณาลองใหม่')
                                }                          
                            })       
                        })                                              
                    }else{
                        reject('เกิดข้อผิดพลาด กรุณาลองใหม่')
                    }                                 
                })
            }) 
        })
    }),
    userinfo:((req, res) => {
        return new Promise((resolve, reject)=>{  
            res.locals.user = req.body   
            db.then((db)=>{ 
                db.collection('users') 
                .find({
                    _id:req.session.userID
                })
                .toArray( (error, results) => {
                    if(!error){
                        if(results.length > 0){
                            resolve(results)
                        }else{
                            reject('ไม่พบข้อมูลผู้ใช้')
                        }
                    }else{
                        reject('เกิดข้อผิดพลาด กรุณาลองใหม่')
                    }
                })
            })            
        })
    }),
    changepassword:((req, res) => {
        return new Promise((resolve, reject)=>{
            res.locals.user = req.body   
            db.then((db)=>{ 
                let password = req.body.password
                bcrypt.hash(password, saltRounds).then((hash)=>{
                    let user = {
                        "password": hash
                    }  
                    db.collection('users')
                    .updateOne({
                        _id:req.session.userID
                    }, 
                    { $set: user }, (error, results) => {
                        if(!error){
                            resolve(results)                                           
                        }else{
                            reject('เกิดข้อผิดพลาด กรุณาลองใหม่')
                        }       
                    })                            
                })            
            })
        })
    }),
    editprofile:((req, res, avatar) => {
        return new Promise((resolve, reject)=>{
            res.locals.user = req.body   
            db.then((db)=>{ 
                let user = {
                    "name": req.body.name,
                    "avatar":avatar
                }  
                db.collection('users')
                .updateOne({
                    _id:req.session.userID
                }, 
                { $set: user }, (error, results) => {
                    if(!error){
                        resolve(results)                                           
                    }else{
                        reject('เกิดข้อผิดพลาด กรุณาลองใหม่')
                    }       
                })                            
          
            })
        })
    })    
}

module.exports = Users

<!doctype html>
<html>
    <?- include('../partials/head') -?>
<body>
<?- include('../partials/header') -?>
<?- include('../partials/nav') -?>

<div class="container">
    <h1 class="text-center">PROFILE</h1>
    <? if(typeof success !== 'undefined'){ ?>
        <div class="form-group row">
            <div class="col-7 mx-auto">
                <div class="alert alert-success alert-dismissible fade show" role="alert">
                <?= success.message ?>
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                </div>    
            </div>
        </div>
        <? } ?>        
    <? if(typeof errors !== 'undefined'){ ?>
    <div class="form-group row">
        <div class="col-7 mx-auto">
            <div class="alert alert-warning alert-dismissible fade show" role="alert">
            <?= errors.message ?>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
            </div>    
        </div>
    </div>
    <? } ?>        
<form class="mt-3" action="/profile?_csrf=<?= csrfToken ?>" method="POST" 
    enctype="multipart/form-data" novalidate>  
    <div class="form-group row">
        <div class="col-7 mx-auto">
            <input type="hidden" name="h_avatar" value="<?= user.avatar ?>" />
            <input type="file" class="custom-file-input"
            style="display: none" name="avatar"  id="avatar">
            <div id="thumbnail" style="width: 100px;height:100px;
            background: url('avatar/<?= user.avatar ?>') no-repeat;
            background-size: cover" 
            class="border rounded-circle bg-light mx-auto"></div>
        </div>       
    </div>          
    <div class="form-group row">
        <div class="col-7 mx-auto">
            <input type="text" class="form-control" 
            name="name" value="<?= user.name ?>"
            placeholder="Your name">
        </div>       
    </div>    
    <div class="form-group row">
        <div class="col-7 mx-auto">
            <button type="submit" class="btn btn-primary btn-block mx-auto">
            Update Profile</button>
        </div>           
    </div>
</form>

</div>

<?- include('../partials/footer') -?>
<script type="text/javascript" >
$(function () {
    
    
    $("#thumbnail").on("click",function(e){
        $("#avatar").show().click().hide();
        e.preventDefault();
    });
    $("#avatar").on("change",function(e){
        var files = this.files
        showThumbnail(files)        
    });
    
    function showThumbnail(files){
    
        $("#thumbnail").html("");
        for(var i=0;i<files.length;i++){
            var file = files[i]
            var imageType = /image.*/
            if(!file.type.match(imageType)){
                //     console.log("Not an Image");
                continue;
            }
    
            var image = document.createElement("img");
            image.className = 'rounded-circle'
            image.width = 100;
            image.height = 100;
            var thumbnail = document.getElementById("thumbnail");
            image.file = file;
            thumbnail.appendChild(image)
    
            var reader = new FileReader()
            reader.onload = (function(aImg){
                return function(e){
                    aImg.src = e.target.result;
                };
            }(image))
    
            var ret = reader.readAsDataURL(file);
            var canvas = document.createElement("canvas");
            ctx = canvas.getContext("2d");
            image.onload= function(){
                ctx.drawImage(image,100,100)
            }
        } // end for loop
    
    } // end showThumbnail
    
});
</script>    
</body>
</html>

<form class="mt-3" action="/profile?_csrf=<?= csrfToken ?>" method="POST" 
    enctype="multipart/form-data" novalidate>  

<div id="thumbnail" style="width: 100px;height:100px;
background: url('avatar/<?= user.avatar ?>') no-repeat;
background-size: cover" 
class="border rounded-circle bg-light mx-auto"></div>

app.use(express.static(path.join(__dirname, 'uploads')))
// เนื้อหาในบทความ http://niik.in/909

const express = require('express')
const router = express.Router()
const { validationFormData, schema } = require('../validator/users')
const Users = require('../models/users') // ใช้งาน Users model
const path = require('path') // เรียกใช้งาน path module
const multer = require('multer') // ใช้งาน Multer Module

// ส่วนของกาตั้งค่า multer
let upload = multer({ 
    storage:multer.diskStorage({
        destination: function (req, file, cb) {
            cb(null, path.join(__dirname,'..','uploads/avatar'))
        },
        filename: function (req, file, cb) {
            let extArr = file.originalname.split('.')
            let ext = extArr[extArr.length-1]
            cb(null, req.session.userID + '.' + ext)
			// ในที่นี้ เราใช้ชื่อไฟล์เป็น id ของ user จากค่า session เช่น จะได้ค่าเป็น 10002.jpg
        }
    }),
    fileFilter:(req, file, cb)=>{
        if (!file.mimetype.match(/\/(jpg|jpeg|png|gif)$/)) {
            return cb(new Error('เฉพาะไฟล์รูปภาพเท่านั้น!'), false)
        }
        cb(null, true)
    },
    limits:{
        fileSize:2000000 // ขนาดไฟล์ไม่เกิน 2MB
    }
}).single('avatar') // อัพโหลดไฟล์ จากฟิลด์เดียวชื่อ avatar


router.route('/')
    .all((req, res, next) => { 
        // ตัวแปรที่กำหนดด้วย res.locals คือค่าจะส่งไปใช้งานใน template
        res.locals.pageData = {
            title:'Profile Page'
        }
        // ค่าที่จะไปใช้งาน ฟอร์ม ใน template 
        res.locals.user = {
            name:''
        }
        // generate csrfTOken
        res.locals.csrfToken = req.csrfToken()           
        next()
    })
    .get((req, res, next) => { 
		// หากเปิดมายังหน้าแก้ไขข้อมูลส่วนตัว ดึงข้อมูล นำค่าในฐานข้อมูลมาแสดง
        Users.userinfo(req, res).then(
            (user)=>{
                res.locals.user = user[0]   
                if(req.cookies.flash_message){
                    // ถ้ามี นำค่าไปใกำหนดในตัวแปร res.locals เพื่อใช้งานใน template
                    res.locals.success = {
                        message:req.cookies.flash_message
                    }
                }                
                res.render('pages/profile')                 
            }
        )              
    })
    .post((req, res, next) => { 
		// ใช้งานรูปแบบการอัพโหลดไฟล์ รองรับการจัดการ error
        upload(req, res, (error)=>{
			// กรณี error
            if (error instanceof multer.MulterError || error) {
                res.locals.errors = { "message": error }   
                res.locals.user = req.body  
                return res.render('pages/profile')      
            }
			// หากไม่เกิด error ในขั้นตอนการอัพโหลดไฟล์ ก็ให้ทำงานฟังก์ชั่น ตรวจสอบความถูกต้องของข้อมูลต่อ
            validationFormData(schema.profile, req, (error, result)=>{
                if(error){ // หากเกิด error
                    res.locals.errors = { "message": error }     
                    res.locals.user = req.body  
                    return res.render('pages/profile')                                                
                }
				// หากตรวจสอบข้อมูลผ่าน 
                let avatar = req.body.h_avatar // ให้ชื่อรูปเท่ากับค่าเดิม ถ้ามี
                if(typeof req.file !== 'undefined'){ // แต่ถ้ามีการอัพโหลดไฟล์ใหม่เข้ามา
                    avatar = req.file.filename // ให้ใช้ชื่อไฟล์ใหม่
                }
				// ทำคำสั่งอัพเดทข้อมูลในฐานข้อมูล โดยใช้งาน User model
                Users.editprofile(req, res, avatar).then(
                    (results)=>{ 
                        res.cookie('flash_message', 'ทำการแก้ไขข้อมูลเรียบร้อยแล้ว',{maxAge:3000})         
                        res.redirect('/profile')   
                    },
                    (error)=>{
                        res.locals.errors = { "message": error }                 
                        return res.render('pages/profile')    
                    }            
                )                      
            })
        })
    })

module.exports = router

upload(req, res, (error)=>{
	validationFormData(schema.profile, req, (error, result)=>{
		Users.editprofile(req, res, avatar).then()
	})
})

<!doctype html>
<html>
    <?- include('../partials/head') -?>
<body>
<?- include('../partials/header') -?>
<?- include('../partials/nav') -?>

<div class="container">
    <h1 class="text-center">Hello</h1>
    <div class="text-center my-3 border p-3">
        <div id="thumbnail" style="width: 100px;height:100px;
        background: url('avatar/<?= user.avatar ?>') no-repeat;
        background-size: cover" 
        class="border rounded-circle bg-light mx-auto"></div>        
        <?= user.name ?>
        <br/>
        <?= user.email ?>
    </div>
    <div class="text-center">

    </div>
</div>

<?- include('../partials/footer') -?>
</body>
</html>