Node.js, MongoDB

[Node.js, MongoDB] 7. 상세페이지 만들기

qweasd5123 2025. 6. 1. 17:21

URL 파라미터 문법

app.get('/detail/:aaaa', (res, req) => {
  req.send('detail.ejs')
})

URL 입력란에 '/detail/아무문자'로 접속하면 위 코드 실행

'아무문자' 입력란에 글의 id를 입력하면 DB에서 해당 id 글을 가져와서 출력하면 된다.

 

DB에서 특정 document 1개 찾기

findOne() 사용

// a : 1 인 document를 찾는다
await db.collection().findOne({a : 1})

 

'_id'가 아래와 같은 document를 찾으려면

 

 

// _id 번호만 입력하는 것이 아닌 ObjectId까지 같이 입력해야 한다.
await db.collection('post').findOne({_id : new ObjectId('64bfde3b02d2932a4c06ffba')})

 

 

유저가 입력한 URL 가져오기

유저가 입력한 파라미터 가져오기

app.get('/detail/:aaaa', (res, req) => {
  console.log(res.params)
})

 

입력한 파라미터에 해당하는 글 가져오기

app.get('/detail/:id', async (res, req) => {
  let result = await db.collection('post').findOne({ _id : new ObjectId(res.params.id) })
  req.render('detail.ejs', { post : result })
})

 

예외처리

app.get('/detail/:id', async (res, req) => {
    try {
        let result = await db.collection('post').findOne({ _id: new ObjectId(res.params.id) })
        console.log(res.params)
        if (result == null) {
            req.status(404).send('잘못된 url')
        } else {
            req.render('detail.ejs', { post: result })
        }

    } catch (e) {
        console.log(e)
        req.status(404).send('잘못된 url')
    }
})

 

/list 페이지에서 제목을 클릭하면 해당 글의 상세페이지로 접속하기

list.ejs

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link href="/main.css" rel="stylesheet" />
  </head>
  <body class="grey-bg">

    <%- include('nav.ejs') %>

    <div class="white-bg">
      <% for(let i = 0; i < posts.length; i++){ %>
      <div class="list-box">
        <a href="/detail/<%=posts[i]._id%>" ><%= posts[i].title %></a>
        <p><%= posts[i].content %></p>
      </div>
      <% } %>
    </div>
    
  </body>
</html>