본문 바로가기
JavaScript

MongoDB 파일 다루기

by ma_ro 2020. 3. 8.

JavaScript 비동기처리

비동기처리

JavaScript는 기본적으로 비동기처리 방식을 가지고 있다.
함수를 실행할 때 동기 처리 방식은 순서대로 하나씩 끝나기를 기다려서 실행하지만, 비동기 방식은 시간이 오래 걸리는 것은 그대로 실행하게 놔두고 다음 것을 실행한다. 하지만 때로는 순서대로 실행하는 것을 요구해야할 때도 있다.

async에서 await를 지정해줌으로서 순서대로 실행할 것을 지정해줄 수 있다.

const search = async (req, res) => {
  const {
    query: { term: searchingBy }
  } = req; //const searchigBy = req.query.term;
  let videos = [];
  try {
    videos = await Video.find({
      title: { $regex: searchingBy, $options: "i" }
    });
  } catch (error) {
    console.log(error);
  }
  res.render("search", { pageTitle: "Search", videos }); 
};

mongoDB에서 영화 데이터를 받아오는 메서드 예시. 여기서는 Video라는 mongoose 모델 객체를 이용해서 mongoDB에 접근한다.

JavaScript는 기본적으로 비동기 방식이기 때문에, 실행이 완료되기를 기다렸다 차례로 실행되는 것이 아니라, 시간이 걸리면 다음 메서드를 바로 실행시킨다. 때문에 기본적으로는 find 함수를 통해 영화데이터를 다 찾아 오기 전에 페이지를 렌더링하고, 제대로된 videos 데이터가 전달되지 않는다. 그래서 await 메서드를 통해서 데이터를 제대로 다 받아오기까지 기다리라고 지정해주는 것이다.

mongoDB 정규 표현식

위의 예시에서 '$regex'라고 되어있는 부분은 mongoDB에서 정규표현식을 사용하기 위한 속성이다. 다음의 정규표현식에 맞는 것들을 모두 가져오라는 뜻이며, 옵션 i는 대소문자 구분없이 검색하라는 것이다. 기타 다른 옵션은 공식문서 및 하단 참조.

model.find({ "age" : { "$lt" : 40 }}); // 미만
model.find({ "age" : { "$lte" : 40 }}); // 이하
model.find({ 'age' : { '$gt' : 47 }}); // 초과
model.find({ 'age' : { '$gte' : 47 }}); // 이상

Multer

파일 업로드를 위해 사용되는 multipart/form-data를 다루기 위한 node.js의 미들웨어. multipart/form-data의 form에서만 동작한다.

설치

npm i multer

사용

  • body 객체와 한개의 file 혹은 여러 개의 files 객체를 request 겍체에서 포함
  • body 객체는 폼 텍스트 필드의 값을 포함
  • file 혹은 files 객체는 폼을 통해 업로드된 파일들을 포함
var multer  = require('multer')
var upload = multer({ dest: 'uploads/' })

var app = express()

app.post('/profile', upload.single('avatar'), function (req, res, next) {
  // req.file 은 `avatar` 라는 필드의 파일 정보입니다.
  // 텍스트 필드가 있는 경우, req.body가 이를 포함할 것입니다.
})

multer 객체를 통해 옵션 설정이 가능하다. dest 옵션은 파일을 어디에 업로드할지 알려준다. single 메서드는 한 개의 파일을 업로드할 때 사용한다. 웹앱에서는 중간에 미들웨어로 사용하여 페이지를 렌더링하기 전에 파일 처리를 한다.

폼에서 'avatar'라는 이름으로 파일이 전달되면 upload 객체가 해당 파일을 처리한다. 그리고 다음 미들웨어로 file 객체를 전달해준다. 각각의 파일 객체는 다음의 정보를 포함하고 있다.

Key Description Note
fieldname 폼에 정의된 필드 명
originalname 사용자가 업로드한 파일 명
encoding 파일의 엔코딩 타입
mimetype 파일의 Mime 타입
size 파일의 바이트(byte) 사이즈
destination 파일이 저장된 폴더 DiskStorage
filename destination 에 저장된 파일 명 DiskStorage
path 업로드된 파일의 전체 경로 DiskStorage
buffer 전체 파일의 Buffer MemoryStorage
const postUpload = async (req, res) => {
  const {
    body: { title, description },
    file: { path }
  } = req;

  const newVideo = await Video.create({
    fileUrl: path,
    title,
    description
  });
  res.redirect(routes.videoDetail(newVideo.id));
};

파일 객체를 넘겨 받은 postupload 미들웨어에서 저장된 파일의 경로를 받아올 수 있고, 이걸 가지고 vieo 데이터를 만들어서 DB에 저장할 수 있다. 출력할 때는 비디오 자체를 넘기는 것이 아니라, 이 url만 넘겨서

'JavaScript' 카테고리의 다른 글

Webpack  (0) 2020.03.13
JavaScript - Typed Array  (0) 2020.03.11
MongoDB with node.js  (0) 2020.03.03
Express 404처리  (0) 2020.03.02
Variables in Pug  (0) 2020.02.24

댓글