블로그용 API 만들기 - 完 -

카테고리 추가/불러오기

카테고리 스키마/ 모델로 내보내기

//models/Category.js
const mongoose = require("mongoose");

const CategorySchema = new mongoose.Schema(
    {
        name: {
            type:String,
            required:true
        }
    },
    { timestamps: true }
);

module.exports = mongoose.model("Category", CategorySchema);

카테고리 라우터 작성

//routes/categories.js
const router = require("express").Router();
const Category  = require("../models/Category");

router.post("/", async (req, res) => {
    const newCat = new Category(req.body);
    try {
        const savedCat = await newCat.save();
        res.status(200).json(savedCat);
    } catch (err) {
        res.status(500).json(err)
    }
})

module.exports = router;

index.js에 라우터 불러오기

//index.js
const catRoute = require("./routes/categories");
//...
app.use('/api/category', catRoute);

const newCat = new Category(req.body);
---> 카테고리 모델 생성자로 새 카테고리 몽구스 문서를 만든다.
const savedCat = await newCat.save(); ---> DB에 저장

응답 테스트

MongoDB

multer를 이용한 파일업로드 구현

설치 npm install multer
파일업로드를 하기 위해 사용되는 멀티파트 폼(multipart/form-data)을 다루기 위한 미들웨어

expressjs/Multer -github
한국어 문서로 엄청 친절하게 써있다.

//index.js
const multer = require("multer");
const storage = multer.diskStorage({
    destination:(req,file,cb) => {
        cb(null, "images")
    },filename:(req,file,cb) => {
        cb(null,req.body.name);
    },
});

const upload = multer({storage:storage});
app.post("/api/upload", upload.single("file"),(req,res) => {
    res.status(200).json("파일이 업로드 되었습니다.")
})

뮬터는 req에 파일객체와 텍스트객체를 포함한다.
한 개의 파일객체(file)
여러개의 파일객체(files)
파일명과 형태 텍스트 객체 (req.body)
const multer = require("multer");
설치한 뮬터를 불러온다.
const storage = multer.diskStorgae()
파일을 디스크에 저장하기 위한 제어기능 제공

//multer github 예제
const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, '/tmp/my-uploads')
  },
  filename: function (req, file, cb) {
    cb(null, file.fieldname + '-' + Date.now())
  }
})

const upload = multer({ storage: storage })

destination: function (req, file, cb){cb(null, '/tmp/my-uploads')},
데스티네이션은 업로드 될 파일이 도착할 경로를 지정한다.
cb는 콜백이며 error를 처리해준다. cb의 두번째 인수로 파일경로를 문자열(String)으로 지정할 수 있으며 정하지 않으면 운영체제의 임시폴더로 업로드된다.
참고로 해당 경로의 폴더를 미리 만들어놓아야 작동한다.

filename: function (req, file, cb) { cb(null, file.fieldname + '-' + Date.now())}
파일네임은 업로드될시 정해질 파일이름을 지정한다. 위 코드는 파일객체에 포함된 필드네임에 현재시간을 추가해서 파일명을 지정했다.

filename:(req,file,cb) => {cb(null,req.body.name);},
블로그 API에서는 요청 바디에 들어있는 name 필드로 파일명을 정해준다.
이 부분은 클라이언트 사이드에서 처리한다.
multer에서 파일 확장자에 관여하지 않는다.

const upload = multer({ storage: storage});
뮬터의 업로드 옵션을 정한다(DiskStroage,MemoryStorage)
storage와 dest는 파일이 저장될 위치를 정한다.

app.post("/upload", upload.single("file"),(req,res) => {
  res.status(200).json("파일이 업로드 되었습니다");
});

upload.single(file) -->req.file이 file이라는 필드의 파일 정보를 가지고 있다.(응답테스트 참고)

그밖에도 limits나 filefilter같은 다양한 옵션들이 존재
expressjs/Multer -github

응답 테스트

body를 form-data로 바꿔주고 key에 upload.single("file") 에 있는 file을
KEY에 적어주고 오른쪽 text를 file로 바꿔준 후 VALUE에 이미지 파일을 넣는다.
이렇게 되면 바디에 파일명(req.body.name)을 못넣기 때문에 일단 수동으로 넣어준다. (나중에 client쪽에서 처리해서 넣어주면 된다.)
cb(null, 내이미지.jpg)

설정한 경로와 파일명으로 이미지 업로드 됨

API편 완결
다음은 클라이언트와 서버 연결