AWS S3 이미지 업로드 관련 질문 드려요

[김도균]

다름이 아니라 제가

app.post("/write", async (req, res)=>{
    var count = await db.collection('content');
    var number = await count.findOne({_id: new ObjectId('65945b8f328dbb408ab06d91')});
    var dbPost = await db.collection('post')

    upload.single('imgFile')(req, res, (err)=>{
        console.log(req.file)
        if(err) return res.send('업로드 에러')
        else{
            // console.log(req.files) // 여러개 출력
            try {

                count.updateOne({_id : new ObjectId('65945b8f328dbb408ab06d91')}, {$inc: {total : 1}})
                if(req.body.title == "" && req.body.birthday == "" && req.body.group){
                    res.send("내용을 입력하세요")
                }else{
                    console.log(req.file)
                    if(req.body.group2 == ''){
                        dbPost.insertOne({
                                name: req.body.title,
                                birthday: req.body.birthday,
                                group: req.body.group,
                                group2: "none",
                                time: new Date(),
                                number : number.total + 1,
                                imageUrl : req.file.location
                            })
                    }else{
                        dbPost.insertOne({
                                name : req.body.title,
                                birthday : req.body.birthday,
                                group : req.body.group,
                                group2 : req.body.group2,
                                time: new Date(),
                                number : number.total + 1,
                                imageUrl : req.file.location
                            })
                    }
                    res.redirect("/list/1")
                }
            }catch (e){
                console.log(e)
                res.status(500).send("Server Error")
            }
        }
    })

})
여기서 upload.single을 통해서 이미지를 하나만 전송하도록 구현을 했고 강의에서 말씀 주신 것 처럼 실제 파일 명과 location도 req.file에서 콘솔로 찍어서 확인했습니다

그래서 저는 여기서 /edit기능에도 사진 추가기능을 추가 해보고자 해당 기능을 다시 구현해봤는데요

app.put("/edit",upload.single('imgFile'),async (req, res) => {
    let result = await db.collection('post')
    console.log(req.file)

    result.updateOne({_id : new ObjectId(req.body.id)},
        {$set : {
                name : req.body.name,
                birthday : req.body.birthday,
                group : req.body.group,
                group2 : req.body.group2,
                number : req.body.number
        }})
    res.redirect('/list/1')
}) 이런식으로 구현을 했습니다(아직 테스트 중이라서 updateOne에는 정보를 따로 입력하지 않았습니다) 

put 요청을 보내는 edit.ejs도 아래와 같이 수정을 했구요

<div class="box-list">
    <form action="/edit?_method=PUT" method="post"> <!--클라 -> 서버 -->
        <input value="<%= data._id %>" type="text" name="id" style="display: none">
        <h2>이름 변경</h2>
        <input type="text" placeholder="<%=data.name%>" name="name" value="<%=data.name%>">
        <h2>소속 그룹 변경</h2>
        <input type="text" placeholder="<%=data.group%>" name="group" value="<%=data.group%>">
        <div>
            <h2>제 2 그룹 변경</h2>
            <input type="text" placeholder="" name="group2" value="<%=data.group2%>">
        </div>
        <h2>생일 변경</h2>
        <input type="text" placeholder="<%=data.birthday%>" name="birthday" value="<%=data.birthday%>">
        <div class="box-list box-list-file">
            <input type="file" name="imgFile" accept="image/*"> <!-- 여기에 input 태그 추가 -->
        </div>
        <button type="submit">전송</button>
    </form>
</div>
 그런데 이상하게 위에서 한 것과는 다르게 req.file을 로그로 찍었을 때는 undefind가 찍히더라구여 

해당 현상이 제가 Put요청을 보내서 그런건지 조금 의문이 들어서 이렇게 문의해봅니다 감사합니다

[codingapple]

폼태그에 enctype="" 설정이 빠진듯요

[김도균]

네 감사합니다 선생님!! 정상 작동 확인했습니다;;

[글쓴이]

글