[nodejs] multer fileupload 간단코드

코덩이·2022년 6월 14일
0

NodeJS

목록 보기
1/1

파일업로드 간단 코드 및 결과

  • 최소한의 코드만 작성하여 파일업로드를 실행시켜보았다.
  • form 사용
  • multipart 로 여러 파일 업로드

index.pug

```javascript
extends layout

block content
  h1= title
  p Welcome to #{title}
  form(action='upload' method='post' enctype="multipart/form-data")
    input(type='file' name='userfile')
    input(type='submit')
```
  • index.js
    import express from "express";
    const router = express.Router();
    
    import multer from "multer";
    const upload = multer({ dest: "uploads/" });
    
    /* GET home page. */
    router.get("/", function (req, res, next) {
      res.render("index", { title: "File Upload Project" });
    });
    
    // router.post("/", upload.single("userfile"), (req, res) => {
    //   res.send("Uploaded! : " + req.file);
    //   console.log(req.file);
    // });
    
    router.post("/upload", upload.array("userfile"), (req, res) => {
      const { name } = req.body;
      console.log("body 데이터 : ", name);
      req.files.map((data) => {
        console.log("폼에 정의된 필드명 : ", data.fieldname);
        console.log("사용자가 업로드한 파일 명 : ", data.originalname);
        console.log("파일의 엔코딩 타입 : ", data.encoding);
        console.log("파일의 Mime 타입 : ", data.mimetype);
        console.log("파일이 저장된 폴더 : ", data.destination);
        console.log("destinatin에 저장된 파일 명 : ", data.filename);
        console.log("업로드된 파일의 전체 경로 ", data.path);
        console.log("파일의 바이트(byte 사이즈)", data.size);
      });
      res.json({ ok: true, data: "Multipart Upload Ok" });
      //   res.send("Uploaded: " + req.file);
      //   console.log(req.file);
    });
    
    export default router;
  • 결과 console

    body 데이터 :  undefined
    폼에 정의된 필드명 :  userfile
    사용자가 업로드한 파일 명 :  r1.png
    파일의 엔코딩 타입 :  7bit
    파일의 Mime 타입 :  image/png
    파일이 저장된 폴더 :  uploads/
    destinatin에 저장된 파일 명 :  3e4719c317e783488c40366f6f9a03d0
    업로드된 파일의 전체 경로  uploads\3e4719c317e783488c40366f6f9a03d0
    파일의 바이트(byte 사이즈) 3677505
  • 결과 json
profile
개발공부중

0개의 댓글