여유상점_0925 : 13) Updating Files through Multer ( including Deleting Existing File )

오범준·2020년 9월 22일
0

< Img 처리 >

  • 기초과정 -
    1) 기존 img 파일들 경로 모두 가져오기

2) 새로운 파일 있을 경우, 새로운 변수 담아서 Data_Form에 담기 > 각각 이름을 다르게 하기 > backend에서도 각각의 파일들을 수정시, 다른 fieldname을 토대로 수정하기 ( multer : upload > 다양한 fieldname 부여하기 )

3) 백엔드에서, req.body에는 항상 기존 img 파일 경로가 담겨 있을 것이다

4) 각각의 img 파일 여부, 및 첨부파일 여부에 따라서, 있을 경우, 원래 경로에 있던 이미지 삭제하는 과정도 넣기 ( 어차피 req.files ~ 를 통해 확인된다는 것은, 이미 업로드가 되었다는 것이므로, 삭제 과정만 추가적으로 거치면 된다 )

원래 소스 코드

            // 첫번째 photo를 update 했다면 : 기존의 이미지를 지워준다
            if(req.files.EditPhoto1){
                let BefImg1Path = req.body.ProjImg1.split('/')
                let BefImg1Name = BefImg1Path[BefImg1Path.length -1]
                 fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg1Name, async (err, data) =>{
                    if(err){
                        // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                        if( err.message.split(' ')[0] == 'ENOENT:'){
                            console.log(err)
                            console.log("hello")
                        }else{
                            console.log(err)
                            return res.status(404).json({ message : "Existing Image Delete Error"})
                        }
                    }
                })
            }

            // 2번째 photo를 update 했다면 : 기존의 이미지를 지워준다 
            if(req.files.EditPhoto2){
                let BefImg2Path = req.body.ProjImg2.split('/')
                let BefImg2Name = BefImg2Path[BefImg2Path.length -1]
                 fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg2Name, async (err, data) =>{
                    if(err){
                        // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                        if( err.message.split(' ')[0] == 'ENOENT:'){
                            console.log(err)
                            console.log("hello")
                        }else{
                            console.log(err)
                            return res.status(404).json({ message : "Existing Image Delete Error"})
                        }
                    }
                })
            }

            // 3번째 photo를 update 했다면 : 기존의 이미지를 지워준다
            if(req.files.EditPhoto3){
                let BefImg3Path = req.body.ProjImg3.split('/')
                let BefImg3Name = BefImg3Path[BefImg3Path.length -1]
                
                 fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg3Name, async (err, data) =>{
                    if(err){
                        // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                        if( err.message.split(' ')[0] == 'ENOENT:'){
                            console.log(err)
                            console.log("hello")
                        }else{
                            console.log(err)
                            return res.status(404).json({ message : "Existing Image Delete Error"})
                        }
                    }
                })
            }
            
// Intended Fiinal code
console.log(req.files)

의도한 대로라면, err 와 관련된 모든 콘솔들이 다 찍히고
마지막에 req.files가 찍혀야 하는데...
그러지 못하고 있다는 점 ... 오히려 콜백 function의 특성상
비동기 처리로 인식되어 console.log(req.files) 가 모두 찍히고 나서 나중에야 비로소 검사가 이루어지는 함정이 있다

Promise.Api를 사용해서 비동기 처리 하기

  upload(req,res,(err) => {

        if(err){

            console.log("error in multer")
            console.log(err)
            if( err == 'Images Only'){
                // Photo Upload 오류
                console.log("Image upload Error")
                return res.status(402).json({ message : "Photo Upload Error"})
            }else if(err == "pdf, plain txt, csv, html, msword only"){
                // 첨부파일 upload 오류
                console.log("File upload Error")
                return res.status(401).json({ message : "File Upload Error"})
            }

        }else{

            function EditPhoto1() { 
                return new Promise(( resolve, reject) => {
                // 첫번째 photo를 update 했다면 : 기존의 이미지를 지워준다
                if(req.files.EditPhoto1){
                    let BefImg1Path = req.body.ProjImg1.split('/')
                    let BefImg1Name = BefImg1Path[BefImg1Path.length -1]
                    fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg1Name, async (err, data) =>{
                        if(err){
                            // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                            if( err.errno == -4058){
                                console.log(err)
                                resolve('Photo1 Not Exist but Pass')
                            }else{
                                reject( new Error('Photo1 Error'))
                                // return res.status(404).json({ message : "Existing Image Delete Error"})
                            }
                        }
                     })
                    }else{
                        resolve('Photo1 Ok')
                        }
                    })
                }

            function EditPhoto2(){
                    return new Promise(( resolve, reject) => {
                    // 2번째 photo를 update 했다면 : 기존의 이미지를 지워준다 
                    if(req.files.EditPhoto2){
                        let BefImg2Path = req.body.ProjImg2.split('/')
                        let BefImg2Name = BefImg2Path[BefImg2Path.length -1]
                        fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg2Name, async (err, data) =>{
                            if(err){
                                // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                                if( err.errno == -4058){
                                    resolve('Photo2 Not Exist but Pass')
                                }else{
                                    reject( new Error('Photo2 Error'))
                                    //return res.status(404).json({ message : "Existing Image Delete Error"})
                                }
                            }
                        })
                    }else{
                        resolve('Photo2 Ok')
                    }
                })
            }

            function EditPhoto3 (){
                return new Promise(( resolve, reject) => {
                // 3번째 photo를 update 했다면 : 기존의 이미지를 지워준다
                    if(req.files.EditPhoto3){
                        let BefImg3Path = req.body.ProjImg3.split('/')
                        let BefImg3Name = BefImg3Path[BefImg3Path.length -1]
                        fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg3Name, async (err, data) =>{
                            if(err){
                                // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                                if( err.errno == -4058){
                                    resolve('Photo3 Not Exist but Pass')
                                }else{
                                    reject( new Error('Photo3 Error'))
                                    // return res.status(404).json({ message : "Existing Image Delete Error"})
                                }
                            }
                        })
                    }else{
                        resolve('Photo3 Ok')
                    }
                })
            }
            

            // 위의 파일 
            Promise.all([EditPhoto1(), EditPhoto2(), EditPhoto3()])
                .then((values) => {

                    console.log(values)

                    // req.body로부터 기존 사항들을 가져온다
                    const { 
                        ProgUniqueId,
                        ProjProgNum, 
                        ProgLoc, 
                        ProgSubLoc, 
                        ProjTitle, 
                        ProjReg, 
                        ProjConf, 
                        ProjRegTimeStart,
                        ProjRegTimeEnd,
                        ProjActTimeStart ,
                        ProjActTimeEnd ,
                        ProjCost ,
                        ProjOpt1 ,
                        ProjOpt1Cost ,
                        ProjOpt2,
                        ProjOpt2Cost ,
                        ProjOpt3,
                        ProjOpt3Cost,
                        ProjIsNew ,
                        ProjIsHot ,
                        ProjImg1 ,
                        ProjImg2 ,
                        ProjImg3 ,
                        ProjCreatImg ,
                        ProjCreatName,
                        ProjOneLine ,
                        ProjRecom,
                        ProjLocExp ,
                        ProjProgExp ,
                        ProjActExp,
                        ProjCaution,
                        ProjSchedule,
                        ProjCostExp,
                        ProjRoom,
                        ProjSup,
                        ProjQuestion
                    } = req.body; 

                    console.log(req.files)

                    // img src 혹은 실제 파일 중에서 최종적으로 update할 요소로 대체한다
                    let FinalImg1 = ""
                    if(req.files.EditPhoto1){
                        FinalImg1 = 'http://localhost:3100' + req.files.EditPhoto1[0].destination.split('data')[1] + req.files.EditPhoto1[0].filename 
                    }else{
                        FinalImg1 = ProjImg1
                    }
                    let FinalImg2 = ""
                    if(req.files.EditPhoto2){
                        FinalImg2 = 'http://localhost:3100' + req.files.EditPhoto2[0].destination.split('data')[1] + req.files.EditPhoto2[0].filename 
                    }else{
                        FinalImg2 = ProjImg2
                    }
                    let FinalImg3 = ""
                    if(req.files.EditPhoto3){
                        FinalImg3 = 'http://localhost:3100' + req.files.EditPhoto3[0].destination.split('data')[1] + req.files.EditPhoto3[0].filename 
                    }else{
                        FinalImg3 = ProjImg3
                    }
                    let FinalCreatImg = ""
                    if(req.files.EditCreatPhoto){
                        FinalCreatImg = 'http://localhost:3100' +req.files.EditCreatPhoto[0].destination.split('data')[1] + req.files.EditCreatPhoto[0].filename 
                    }else{
                        FinalCreatImg = ProjCreatImg
                    }

                    console.log(FinalImg1)
                    console.log(FinalImg2)
                    console.log(FinalImg3)
                    console.log(FinalCreatImg)
                    console.log("img change")

                    // 2. admin_region table에 지역 정보만 넣기
                    connection.db_rest.query(`UPDATE project
                    SET 
                    Location         = ?, 
                    LocationRegion   = ?, 
                    RegStartDate     = ?, 
                    RegEndDate       = ?, 
                    Act_StartDate    = ?, 
                    Act_EndDate      = ?, 
                    Questions        = ?, 
                    Option1          = ?, 
                    Option1_Cost     = ?, 
                    Option2          = ?, 
                    Option2_Cost     = ?, 
                    Option3          = ?, 
                    Option3_Cost     = ?, 
                    Prog_Name        = ?, 
                    Is_New           = ?, 
                    Is_Hot           = ?, 
                    TItle_Img1       = ?, 
                    TItle_Img2       = ?, 
                    TItle_Img3       = ?, 
                    Creator_Img      = ?, 
                    Creator_Name     = ?,
                    Creator_Comment  = ?, 
                    Prog_Exp_One     = ?,
                    Prog_Exp         = ?, 
                    Act_Exp          = ?, 
                    Rooms            = ?,
                    Caution          = ?,
                    Cost_Program     = ?, 
                    Cost_Exp         = ?, 
                    Schedule         = ?,
                    Support          = ?, 
                    Prog_Num         = ?, 
                    Regist_Num       = ?, 
                    Confirm_Num      = ?
                    WHERE UniqueId         = ? 
                    `,[ProgLoc, ProgSubLoc,ProjRegTimeStart,ProjRegTimeEnd,ProjActTimeStart
                    ,ProjActTimeEnd,ProjQuestion ,ProjOpt1 ,ProjOpt1Cost ,ProjOpt2, ProjOpt2Cost,
                    ProjOpt3, ProjOpt3Cost, ProjTitle, ProjIsNew,ProjIsHot, FinalImg1, FinalImg2,
                    FinalImg3, FinalCreatImg, ProjCreatName , ProjRecom, ProjOneLine,
                    ProjProgExp,ProjActExp,ProjRoom, ProjCaution, ProjCost , ProjCostExp
                    , ProjSchedule,ProjSup ,ProjProgNum, ProjReg, ProjConf , ProgUniqueId], (error, result) => {
                        if(error){
                            console.log("Error in programRegion Update")
                            console.log(error);
                            return res.status(400).json({message : 'failed'})
                        }else{
                            return res.status(200).json({ message : 'success'})
                        }
                    })

                }).catch(console.log)
                
                
                ~~

즉, Promise 3개가 끝나면
그 이후에 mysql 접근을 하는 코드를 작성한다

최종 프론트

// Projecxt 수정
let ProjectEditForm = document.forms.namedItem('projectEdit');

ProjectEditForm.addEventListener('submit', (event) => {
    event.preventDefault()
    console.log("click")
    // 항목들 불러오기 ------------------------------------------
    // Id
    let UniqueId = document.getElementById('ProgUniqueId')
    // 일련번호
    let ProgNum    = document.getElementById('ProjProgNum')
    // 지역
    let ProgLoc    = ""
    // 주변 지역
    let ProgSubLoc = ""

    if( document.getElementById('ProjLocation').value != ""){
        ProgLoc = document.getElementById('ProjLocation')
        if( ProgLoc.value == "도시"){
            ProgSubLoc = document.getElementById('ProjLocation_City')
        }else if( ProgLoc.value == "자연"){
            ProgSubLoc = document.getElementById('ProjLocation_County')
        }
    }else{
        ProgLoc    = document.getElementById('ProjOldLoc') 
        ProgSubLoc = document.getElementById('ProjOldSubLoc')
    }

    // 프로그램 Title
    let ProgName = document.getElementById('ProjTitle')
    // 신청자 수
    let ProgRegNum = document.getElementById('ProjReg')
    // 확정자 수
    let ProgConfNum = document.getElementById('ProjConf')
    // 신청기간 start
    let ProgRegStart = ""
    if( document.getElementById('ProjRegTimeStartNew').value ){
        ProgRegStart = document.getElementById('ProjRegTimeStartNew')
    }else{
        ProgRegStart = document.getElementById('ProjRegTimeStart')
    }
    // 신청기간 end
    let ProgRegEnd = ""
    if( document.getElementById('ProjRegTimeEndNew').value ){
        ProgRegEnd = document.getElementById('ProjRegTimeEndNew')
    }else{
        ProgRegEnd = document.getElementById('ProjRegTimeEnd')
    }
    // 참가기간 start
    let ProgActStart = ""
    if( document.getElementById('ProjActTimeStartNew').value ){
        ProgActStart = document.getElementById('ProjActTimeStartNew')
    }else{
        ProgActStart = document.getElementById('ProjActTimeStart')
    }
    // 참가기간 end
    let ProgActEnd = ""
    if( document.getElementById('ProjActTimeEndNew').value ){
        ProgActEnd = document.getElementById('ProjActTimeEndNew')
    }else{
        ProgActEnd = document.getElementById('ProjActTimeEnd')
    }
    // 비용
    let ProgCost = document.getElementById('ProjCost')  
    // 옵션 1
    let ProgOpt1 = document.getElementById('ProjOpt1') 
    // 옵션 1 비용
    let ProgOpt1Cost = document.getElementById('ProjOpt1Cost') 
    // 옵션 2 
    let ProgOpt2 = document.getElementById('ProjOpt2')
    // 옵션 2 비용
    let ProgOpt2Cost = document.getElementById('ProjOpt2Cost')
    // 옵션 3
    let ProgOpt3 = document.getElementById('ProjOpt3')
    // 옵션 3 비용
    let ProgOpt3Cost = document.getElementById('ProjOpt3Cost')
    // Is_New
    let Is_New = document.getElementById('ProjIsNew') 
    // Is_Hot
    let Is_Hot = document.getElementById('ProjIsHot') 
    
    // Img1
    let Img1Src  = document.getElementById('ProjImg1')
    let NewImg1  = null
    console.log("NewImg:",NewImg1)
    if(document.getElementById('ProjImg1New').files[0] != undefined){
        NewImg1 = document.getElementById('ProjImg1New').files[0]
        // 이미지 형식 검사
        uploadFile(NewImg1)
    }
    console.log("NewImg:",NewImg1)
    
    // Img2
    let Img2Src  = document.getElementById('ProjImg2')
    let NewImg2  = null
    if(document.getElementById('ProjImg2New').files[0] != undefined){
        NewImg2 = document.getElementById('ProjImg2New').files[0]
        uploadFile(NewImg2)
    }
    
    // Img3
    let Img3Src  = document.getElementById('ProjImg3')   
    let NewImg3  = null
    if(document.getElementById('ProjImg3New').files[0] != undefined){
        NewImg3 = document.getElementById('ProjImg3New').files[0]
        uploadFile(NewImg3)
    }
    
    // Creator Img
    let CreatImg = document.getElementById('ProjCreatImg')      
    let NewCreatImg  = null
    if(document.getElementById('ProjCreatImgNew').files[0] != undefined){
        NewCreatImg = document.getElementById('ProjCreatImgNew').files[0]
        uploadFile(CreatImg)
    }
    // Related File
    let ProgFiles  = document.getElementById('ProjFile')   
    // Creator Name
    let CreatName = document.getElementById('ProjCreatName')
    // Recommend 
    let Recommend = document.getElementById('ProjRecom') 
    // One Line
    let ProgOneLine = document.getElementById('ProjOneLine')
    // LocExp ( 지역 소개 )
    let ProgLocExp = document.getElementById('ProjLocExp')     
    // ProgExp ( 프로그램 소개 )
    let ProgExp    = document.getElementById('ProjProgExp')
    // ProgActExp  
    let ProgActExp = document.getElementById('ProjActExp')
    // Caution
    let Caution    = document.getElementById('ProjCaution')
    // Schedule
    let Schedule   = document.getElementById('ProjSchedule')
    // ProgCostExp
    let ProgCostExp   = document.getElementById('ProjCostExp')
    // ProjRoom ( 숙소 제공 사항)
    let ProjRoom = document.getElementById('ProjRoom')
    // ProgSupport ( 제공 사항 )
    let ProgSupp   = document.getElementById('ProjSup')
    // Prog Qusetion ( 자주 묻는 질문 )
    let ProgQuestion = document.getElementById('ProjQuestion')
    
   //Textarea들은 '/n'을 <br>로 변환 ------------------------
   let ProjTextAreas = [ ProgOneLine ,ProgLocExp, ProgExp , ProgActExp ,
    Caution, Schedule,ProgCostExp, ProjRoom, ProgSupp,ProgQuestion ]
    
    ProjTextAreas.forEach((TextArea) => {
        TextArea.value = ChangeBr(TextArea.value)
    })
    
    let Data_Form = new FormData()

    // input : type = "text" with class = "input_text"
    let ProjInputs    = [ UniqueId, ProgNum,ProgLoc,ProgSubLoc,ProgName,ProgRegNum ,
    ProgConfNum ,ProgRegStart,ProgRegEnd, ProgActStart, ProgActEnd,
    ProgCost ,ProgOpt1, ProgOpt1Cost, ProgOpt2, ProgOpt2Cost, ProgOpt3 ,
    ProgOpt3Cost ,CreatName,Recommend, Is_New,Is_Hot,Img1Src,Img2Src,Img3Src,CreatImg ]

    ProjInputs.forEach((input) => {
        if( input == Img1Src || input == Img2Src || input == Img3Src || input == CreatImg){
            Data_Form.append(input.attributes.id.value, input.src)
        }else if( input == ProgLoc ){
            Data_Form.append("ProgLoc", input.value)
        }else if( input == ProgSubLoc ){
            Data_Form.append("ProgSubLoc", input.value)
        }else{
            Data_Form.append(input.attributes.id.value, input.value)
        }
    })

    // TextAreas
    ProjTextAreas.forEach((TextArea) => {
        Data_Form.append(TextArea.attributes.id.value, TextArea.value)
    })
    
    // Files_ Images
    if(NewImg1 != null){
        Data_Form.append('EditPhoto1', NewImg1)
    }
    if(NewImg2 != null){
        Data_Form.append('EditPhoto2', NewImg2)
    }
    if(NewImg3 != null){
        Data_Form.append('EditPhoto3', NewImg3)
    }
    if(CreatImg != null){
        Data_Form.append('EditCreatPhoto', CreatImg)
    }

   // Files_ 첨부 파일 등
   // Data_Form.append('Files', AddedFile)   
   fetch('http://localhost:3100/admin/projectEdit', 
    {method : 'POST',body : Data_Form})
    .then(res => res.json())
    .then(res => {
        console.log(res)
        if(res.message === 'success'){
            alert(`프로젝트가 성공적으로 업로드 되었습니다`)
            console.log('project upload successful')
            setTimeout(() => {
                window.location.href = "/admin/part/3"
            }, 1000);
        }else if( res.message === 'failed'){
            alert("서버 오류 . 고객센터 문의 혹은 다시 시도")
            event.preventDefault()
        }else if( res.message == 'Image Error'){
            alert("Image 처리 오류")
            event.preventDefault()
        }else if( res.message == 'Image Too many'){
            alert("Image 를 너무 많이 올렸습니다")
            event.preventDefault()
        }else if( res.status == "Photo Upload Error"){
            alert("사진 업로드 이상해요. 사진 형식 확인해주세요 ~ jpeg|jpg|png|gif 만 !")
            event.preventDefault()
        }else if( res.message == "File Upload Error"){
            alert("첨부파일 업로드 이상해요. pdf, csv, txt, html, xlsx 만")
            event.preventDefault()
        }else if( res.message == "Existing Image Delete Error"){
            alert("기존 파일을 지우는 과정에서 오류가 있어요. 개발자 문의해주세요")
            event.preventDefault()
        }
   })
   .catch(error => {
       console.log(error)
   })
})

최종 백앤드

// Set The Storage Engine
const storage = multer.diskStorage({
    destination: __dirname + '../../../../client/data/img/uploadedImage/Projects/',
    filename: function(req, file, cb){
      cb(null,Date.now() + '-' + file.originalname );
    }
  });
  
  // Init Upload
  const upload = multer({
    storage: storage,
    limits:{fileSize: 1000000},
    fileFilter: function(req, file, cb){
      checkFileType(file, cb);
    }
  }).fields([
                // 사진
                { name : 'Photos', maxCount : 10 },
                // 첨부 파일
                { name : 'Files', maxCount : 5 },
                // 수정 img 1
                { name : 'EditPhoto1', maxCount : 5 },
                // 수정 img 2
                { name : 'EditPhoto2', maxCount : 5 },
                // 수정 img 3
                { name : 'EditPhoto3', maxCount : 5 },
                // 수정 img 4
                { name : 'EditCreatPhoto', maxCount : 5 },
            ])
  
  // Check File Type
  function checkFileType(file, cb){
    // 파일이 존재한다면

    // 업로드 파일이 사진이라면
    if( file.fieldname == 'Photos' ||
        file.fieldname == 'EditPhoto1' ||
        file.fieldname == 'EditPhoto2' ||
        file.fieldname == 'EditPhoto3'){
        // 1 Allowed Img ext
        const Imgfiletypes = /jpeg|jpg|png|gif/;
        // 1 Check Img ext
        const Imgextname = Imgfiletypes.test(path.extname(file.originalname).toLowerCase());
        // 1 Check Img mime
        const Imgmimetype = Imgfiletypes.test(file.mimetype);

        if(Imgmimetype && Imgextname){
        return cb(null,true);
        }else {
        cb('Images Only');
        }
    // 업로드 파일이 사진 이외의 것이라면
    }
    else{
        if(file != undefined){
            if (
                file.mimetype === 'application/pdf' ||
                file.mimetype === 'text/plain' ||
                file.mimetype === 'text/csv' ||
                file.mimetype === 'text/html' ||
                file.mimetype === 'application/msword' ||
                file.mimetype === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' ||
                file.mimetype === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
            ) { // check file type to be pdf, doc, or docx
                cb(null, true);
            } else {
                cb('pdf, plain txt, csv, html, msword only'); // else fails
            }
        }
    }
}



// project Edit
router.post('/projectEdit', (req,res) => {

    upload(req,res,(err) => {

        if(err){

            console.log("error in multer")
            console.log(err)
            if( err == 'Images Only'){
                // Photo Upload 오류
                console.log("Image upload Error")
                return res.status(402).json({ message : "Photo Upload Error"})
            }else if(err == "pdf, plain txt, csv, html, msword only"){
                // 첨부파일 upload 오류
                console.log("File upload Error")
                return res.status(401).json({ message : "File Upload Error"})
            }

        }else{

            function EditPhoto1() { 
                return new Promise(( resolve, reject) => {
                // 첫번째 photo를 update 했다면 : 기존의 이미지를 지워준다
                if(req.files.EditPhoto1){
                    let BefImg1Path = req.body.ProjImg1.split('/')
                    let BefImg1Name = BefImg1Path[BefImg1Path.length -1]
                    fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg1Name, async (err, data) =>{
                        if(err){
                            // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                            if( err.errno == -4058){
                                console.log(err)
                                resolve('Photo1 Not Exist but Pass')
                            }else{
                                reject( new Error('Photo1 Error'))
                                // return res.status(404).json({ message : "Existing Image Delete Error"})
                            }
                        }
                     })
                    }else{
                        resolve('Photo1 Ok')
                        }
                    })
                }

            function EditPhoto2(){
                    return new Promise(( resolve, reject) => {
                    // 2번째 photo를 update 했다면 : 기존의 이미지를 지워준다 
                    if(req.files.EditPhoto2){
                        let BefImg2Path = req.body.ProjImg2.split('/')
                        let BefImg2Name = BefImg2Path[BefImg2Path.length -1]
                        fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg2Name, async (err, data) =>{
                            if(err){
                                // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                                if( err.errno == -4058){
                                    resolve('Photo2 Not Exist but Pass')
                                }else{
                                    reject( new Error('Photo2 Error'))
                                    //return res.status(404).json({ message : "Existing Image Delete Error"})
                                }
                            }
                        })
                    }else{
                        resolve('Photo2 Ok')
                    }
                })
            }

            function EditPhoto3 (){
                return new Promise(( resolve, reject) => {
                // 3번째 photo를 update 했다면 : 기존의 이미지를 지워준다
                    if(req.files.EditPhoto3){
                        let BefImg3Path = req.body.ProjImg3.split('/')
                        let BefImg3Name = BefImg3Path[BefImg3Path.length -1]
                        fs.unlink(__dirname + '../../../../client/data/img/uploadedImage/Projects/'+ BefImg3Name, async (err, data) =>{
                            if(err){
                                // 만약 해당 파일이 없는 경우 ( 원래는 있어야 하는데, 관리자가 임의로 지웠을 수 있다)
                                if( err.errno == -4058){
                                    resolve('Photo3 Not Exist but Pass')
                                }else{
                                    reject( new Error('Photo3 Error'))
                                    // return res.status(404).json({ message : "Existing Image Delete Error"})
                                }
                            }
                        })
                    }else{
                        resolve('Photo3 Ok')
                    }
                })
            }
            

            // 위의 파일 
            Promise.all([EditPhoto1(), EditPhoto2(), EditPhoto3()])
                .then((values) => {

                    console.log(values)

                    // req.body로부터 기존 사항들을 가져온다
                    const { 
                        ProgUniqueId,
                        ProjProgNum, 
                        ProgLoc, 
                        ProgSubLoc, 
                        ProjTitle, 
                        ProjReg, 
                        ProjConf, 
                        ProjRegTimeStart,
                        ProjRegTimeEnd,
                        ProjActTimeStart ,
                        ProjActTimeEnd ,
                        ProjCost ,
                        ProjOpt1 ,
                        ProjOpt1Cost ,
                        ProjOpt2,
                        ProjOpt2Cost ,
                        ProjOpt3,
                        ProjOpt3Cost,
                        ProjIsNew ,
                        ProjIsHot ,
                        ProjImg1 ,
                        ProjImg2 ,
                        ProjImg3 ,
                        ProjCreatImg ,
                        ProjCreatName,
                        ProjOneLine ,
                        ProjRecom,
                        ProjLocExp ,
                        ProjProgExp ,
                        ProjActExp,
                        ProjCaution,
                        ProjSchedule,
                        ProjCostExp,
                        ProjRoom,
                        ProjSup,
                        ProjQuestion
                    } = req.body; 

                    console.log(req.files)

                    // img src 혹은 실제 파일 중에서 최종적으로 update할 요소로 대체한다
                    let FinalImg1 = ""
                    if(req.files.EditPhoto1){
                        FinalImg1 = 'http://localhost:3100' + req.files.EditPhoto1[0].destination.split('data')[1] + req.files.EditPhoto1[0].filename 
                    }else{
                        FinalImg1 = ProjImg1
                    }
                    let FinalImg2 = ""
                    if(req.files.EditPhoto2){
                        FinalImg2 = 'http://localhost:3100' + req.files.EditPhoto2[0].destination.split('data')[1] + req.files.EditPhoto2[0].filename 
                    }else{
                        FinalImg2 = ProjImg2
                    }
                    let FinalImg3 = ""
                    if(req.files.EditPhoto3){
                        FinalImg3 = 'http://localhost:3100' + req.files.EditPhoto3[0].destination.split('data')[1] + req.files.EditPhoto3[0].filename 
                    }else{
                        FinalImg3 = ProjImg3
                    }
                    let FinalCreatImg = ""
                    if(req.files.EditCreatPhoto){
                        FinalCreatImg = 'http://localhost:3100' +req.files.EditCreatPhoto[0].destination.split('data')[1] + req.files.EditCreatPhoto[0].filename 
                    }else{
                        FinalCreatImg = ProjCreatImg
                    }

                    console.log(FinalImg1)
                    console.log(FinalImg2)
                    console.log(FinalImg3)
                    console.log(FinalCreatImg)
                    console.log("img change")

                    // 2. admin_region table에 지역 정보만 넣기
                    connection.db_rest.query(`UPDATE project
                    SET 
                    Location         = ?, 
                    LocationRegion   = ?, 
                    RegStartDate     = ?, 
                    RegEndDate       = ?, 
                    Act_StartDate    = ?, 
                    Act_EndDate      = ?, 
                    Questions        = ?, 
                    Option1          = ?, 
                    Option1_Cost     = ?, 
                    Option2          = ?, 
                    Option2_Cost     = ?, 
                    Option3          = ?, 
                    Option3_Cost     = ?, 
                    Prog_Name        = ?, 
                    Is_New           = ?, 
                    Is_Hot           = ?, 
                    TItle_Img1       = ?, 
                    TItle_Img2       = ?, 
                    TItle_Img3       = ?, 
                    Creator_Img      = ?, 
                    Creator_Name     = ?,
                    Creator_Comment  = ?, 
                    Prog_Exp_One     = ?,
                    Prog_Exp         = ?, 
                    Act_Exp          = ?, 
                    Rooms            = ?,
                    Caution          = ?,
                    Cost_Program     = ?, 
                    Cost_Exp         = ?, 
                    Schedule         = ?,
                    Support          = ?, 
                    Prog_Num         = ?, 
                    Regist_Num       = ?, 
                    Confirm_Num      = ?
                    WHERE UniqueId         = ? 
                    `,[ProgLoc, ProgSubLoc,ProjRegTimeStart,ProjRegTimeEnd,ProjActTimeStart
                    ,ProjActTimeEnd,ProjQuestion ,ProjOpt1 ,ProjOpt1Cost ,ProjOpt2, ProjOpt2Cost,
                    ProjOpt3, ProjOpt3Cost, ProjTitle, ProjIsNew,ProjIsHot, FinalImg1, FinalImg2,
                    FinalImg3, FinalCreatImg, ProjCreatName , ProjRecom, ProjOneLine,
                    ProjProgExp,ProjActExp,ProjRoom, ProjCaution, ProjCost , ProjCostExp
                    , ProjSchedule,ProjSup ,ProjProgNum, ProjReg, ProjConf , ProgUniqueId], (error, result) => {
                        if(error){
                            console.log("Error in programRegion Update")
                            console.log(error);
                            return res.status(400).json({message : 'failed'})
                        }else{
                            return res.status(200).json({ message : 'success'})
                        }
                    })

                }).catch(console.log)
            }
        })
})
profile
Dream of being "물빵개" ( Go abroad for Dance and Programming)

0개의 댓글