Mongoose 페이징 처리 (Node)

몽구스를 이용하여 페이징 처리 방법

 

post라는 모델에 있는 게시물을 페이징 처리 

 

• 모델

//모델
const Post = require('../models/post')

• 프론트 요청값 

// 프론트에서 요청하는 페이지번호, 요청하는 최대 게시물 숫자 

//해당 페이지 번호
const page = req.params.page
//최대 요청 수
const maxPost = req.params.maxPost

• 페이징 함수

const paging = (page, totalPost, maxPost) => {
	// 페이지에 나오는 최대 게시물 수
    const maxPost = maxPost
    
    // 페이지에 나오는 최대 페이지 수
    const maxPage = maxPost
    
    // 받아오는 page가 스트링일경우 Number형으로 변경하고, 아닐경우 1로 입력
    let currentPage = page ? parseInt(page) : 1
    
    // 표시할 게시물이 없을 경우 남은 페이지는 1, 
    // 게시물이 뒤에 있을경우 page -1 를 하고 maxPost값을 곱한다 
    const hidePost = page === 1 ? 0 : (page - 1) * maxPost
    
    // 페이징처리해야하는 페이지 수 
    // Math.ceil은 나머지값이 있으면 올림처리한다.
    const totalPage = Math.ceil(totalPost / maxPost)
    
    // url로 직접 접근하는 경우, 
    // currentPage가 totalPage보다 클 경우 currentPage를 마지막 페이지로 바꿔준다
    if (currentPage > totalPage) {
      currentPage = totalPage
    }
    
    // 화면에 표시할 페이지의 시작 번호를 구한다.
    // Math.floor 소수점 이하를 제거
    // (현재 페이지 번호 -1 / 최대 페이지 번호) * 최대 페이지 번호 + 1 = 시작 페이지 번호 
    const startPage = Math.floor(((currentPage - 1) / maxPage)) * maxPage + 1
    
    // 화면에 표시할 페이지의 마지막 번호를 구한다.
    // 페이지 시작 번호 + 최대 페이지 번호 - 1
    let endPage = startPage + maxPage - 1
    
    // endPage 필요이상을 늘어나는것을 방지
    // maxPage === 10, totalPage === 25, statePage === 21 경우
    // endPage가 30 되면 정보가 없는 칸이 늘어나기 때문에 방지
    if (endPage > totalPage) {
      endPage = totalPage
    }
    
    return { startPage, endPage, hidePost, maxPost, totalPage, currentPage }
}

• 총 게시물 수 

// 총 게시물 수 
const totalPost = await Post.countDocuments({})

• 페이징 함수 호출, 요청한 페이지 만큼 검색 후 json으로 전달

//페이징 함수 호출
const { startPage, endPage, hidePost, maxPost, totalPage, currentPage } = paging(page, totalPost, maxPost)

//포스트 검색 
  const post = await Post.find({})
  	//name을 기준으로 내림차순, 1일경우 오름차순
    .sort({ name: -1 })
  	//제외할 게시물 hidePost === 10 경우  검색은 11부터 시작 
    .skip(hidePost)
    //게시물 수 maxPost === 3 일경우 3개만 가져옴
    .limit(maxPost)
    
//res.json 전달
res.json({ post, startPage, endPage, hidePost, maxPost, totalPage, currentPage })

• 전체

//모델
const Post = require('../models/post')

//페이징 함수
router.get('/post/:page/:maxPost', async (req, res, next) => {

// 프론트에서 요청하는 페이지번호, 요청하는 최대 게시물 숫자 
const page = req.params.page
const maxPost = req.params.maxPost

const paging = (page, totalPost, maxPost) => {
    const maxPost = maxPost
    const maxPage = maxPost
    let currentPage = page ? parseInt(page) : 1
    const hidePost = page === 1 ? 0 : (page - 1) * maxPost
    const totalPage = Math.ceil(totalPost / maxPost)
    if (currentPage > totalPage) {
      currentPage = totalPage
    }
    const startPage = Math.floor(((currentPage - 1) / maxPage)) * maxPage + 1
    let endPage = startPage + maxPage - 1
    if (endPage > totalPage) {
      endPage = totalPage
    }
    return { startPage, endPage, hidePost, maxPost, totalPage, currentPage }
}

// 총 게시물 수 
const totalPost = await Post.countDocuments({ })

//페이징 함수 호출
const { 
  startPage, 
  endPage, 
  hidePost, 
  maxPost, 
  totalPage, 
  currentPage 
} = paging(page, totalPost, maxPost)

//포스트 검색 
  const post = await Post.find({})
    .sort({ createAt: -1 })
    .skip(hidePost)
    .limit(maxPost)
    
//res.json 전달
res.json({ post, startPage, endPage, hidePost, maxPost, totalPage, currentPage })
})

 

 

출처 : velog.io/@won-developer/Node.js-mongoose-%ED%8E%98%EC%9D%B4%EC%A7%95-%EA%B8%B0%EB%8A%A5-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0