Node.js
node.js - method-override 라이브러리 PUT 구현
rhanziy
2023. 3. 20. 14:05
/edit/게시물id url 접속 시 올렸던 게시물 수정페이지를 구현해보자.
server.js 코드
app.get('/edit/:id', function(요청, 응답){
db.collection('post').findOne({ _id : parseInt(요청.params.id) }, function(에러, 결과){
응답.render('edit.ejs', { post : 결과 })
})
edit.ejs에서 PUT을 구현해야하는데 PUT과 DELETE는 html에서 구현못한다.
그러므로 이번엔 method-override 라이브러리를 사용해봅시다 ^0^
npm install method-override
server.js 상단에 코드 2줄 추가
const methodOverride = require('method-override')
app.use(methodOverride('_method'))
그리고 app.put 구현코드 db엔 updateOne()함수로 접근한다.
app.put('/edit', function(요청, 응답){
db.collection('post').updateOne( {_id : ??}, {$set : { 제목 : ??, 날짜 : ?? }}, function(){
console.log('수정완료')
});
});
그러려면 edit.ejs에서 요청 값을 넘겨줘야겠죠.
id값을 몰래 숨겨서 server.js에 넘겨주자
<form action="/edit?_method=PUT" method="POST">
<input value="<%= post._id %>" name="id" style="display : none">
나머지 어쩌구~
// server.js에서 input 태그의 name속성 이름으로 접근할 수 있다.
</form>
app.put('/edit', (req, res)=>{
db.collection('post').updateOne({ _id: parseInt(req.body.id) },
{ $set : { title: req.body.title, date : req.body.date} },
function(){
console.log('수정완료')
res.redirect('/list')
});
})
반복되는 parseInt작업과 수정이 완료되면 /list로 연결까지. req.body.title < 의 title은
edit.ejs파일의 input태그 안 name속성 이름이다.
<input type="text" class="form-control" name="title" value="<%= post.title%>">
form태그안의 입력값들을 요청.body.속성이름으로 가져올 수 있지.