티스토리 뷰

반응형

React에서 FormData()를 사용하여 File 및 Json,Array 데이터 넘기기에 이어 Server단 코드 입니다.

https://seung-min.tistory.com/44

 

[React] FormData()사용 file 및 json, array 데이터 보내기

위 사진과 같이 파일과 파일에 해당하는 파일명, 설명, 태그 등 사용자에게 입력 받은 값을 서버로 전송해야할 일이 있습니다. file 만 보내는글은 많지만 json까지 같이 보내는건 많지 않아서 작

seung-min.tistory.com

넘어온 데이터를 보면 다음과 같습니다.

위의 결과에서 보면 Json,array,File이 한번에 넘어온걸 볼 수 있습니다. 

 

const multer = require("multer");
const fs = require("fs");
const moment = require("moment");

/*파일 업로드를 위한 Multer 사용 선언*/
function fileUpload(req, res) {
    const filePath = "파일 저장 경로 선언"
    const storage = multer.diskStorage({
        destination: function (req, file, cb) {
            cb(null, `${filePath}`); // 파일이 저장되는 경로입니다.
        },
        filename: function (req, file, cb) {
            cb(null, moment().format("YYYYMMDDHHmmss") + "_" + file.originalname); // 파일 저장 포멧
        },
    });

    const upload = multer({ storage: storage }).single("file"); // single : 하나의 파일업로드 할때

    upload(req, res, function (err) {
        if (err instanceof multer.MulterError) {
        } else if (err) {
        }

        getConnection((connection) => {
            if (req.file) {
            	//JSON.parse()를 사용 안하면 "title":"JSONTILE","tag":"Tag" 이런식으로 사용가능
                const jsonData = JSON.parse(req.body.jsonData); 
                const arrayData = req.body.arrayData;
                console.log(jsonData); 
                console.log(arrayData);
                console.log(req.file);

                try {
           			//필요시 DB에 저장
                    res.send(true);
                } catch (err) {
                    //에러 발생 파일 삭제 ex)DB에 insert 실패
                    if (fs.existsSync(req.file.path)) {
                        fs.unlinkSync(req.file.path);
                    }
                    logger.error(err);
                    res.send(false);
                } finally {
                    connection.release();
                }
            } else {
                res.send("Empty Files");
            }
        });
    });
}

/*파일 업로드 업로드*/
router.post("/uploadFile", function (req, res) {

	/*API 인증 모듈 웨어 작성 후*/
    const auth = req.headers.authorization;
    
    /*파일 업로드 함수 동작*/
    fileUpload(req, res);
   
   
});
반응형
댓글
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2025/04   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30
글 보관함