doctype html
html
head
meta(charset='utf-8')
body
form(action='/form_receiver' method='post')
p
input(type='text' name='title')
p
textarea(name='description')
p
input(type='submit')app.post('/form_receiver', function (req, res) {
res.send('Hello, POST');
});이와 같이 작성하면 Hello, POST가 출력되는 것을 확인할 수 있다.
사용자가 POST 방식으로 데이터를 전송한 것이다.
app.get('/form_receiver', function (req, res) {
var title = req.query.title;
var description = req.query.description;
res.send(title + ',' + description);
});이 코드처럼 post 방식도 똑같이 작성하면
app.post('/form_receiver', function (req, res) {
var title = req.body.title;
var description = req.body.description;
res.send(title + ',' + description);
});이렇게 작성할 수 있다. query 대신 body를 써서 작성한다.
하지만 오류가 날 것이다.
var title = req.body.title;req 객체가 body라는 객체를 갖고 있지 않아서 에러가 난 것이다.
이를 해결하기 위해 body-parser를 이용해야한다.
body-parser는 post 방식으로 전송한 데이터를 애플리케이션에서 사용할 수 있도록 해주는 플러그인이라고 보면 된다.
그러면 결과적으로 body라는 property를 req안에서 사용할 수 있다.
npm install body-parserbody-parser 설치
그리고 body-parser라는 모듈을 가져와야한다.
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({extended: false}))body-parser라는 모듈을 use메서드를 통해 연결시켜준다.
이 코드를 포함시킴으로써 가져온 body-parser라는 모듈을 적극적으로 사용하게 된다.
무슨 의미냐라고 생각할 수도 있을텐데 쉽게 말해 애플리케이션에 들어오는 모든 요청들은 body-parser라는 확장기능을 먼저 통하고, route가 동작하게 된다.
<전체코드>
var express = require('express');
var bodyParser = require('body-parser');
var app = express();
app.locals.pretty = true;
app.set('view engine', 'pug');
app.set('views', './views');
app.use(express.static('public'));
app.use(bodyParser.urlencoded({extended: false}))
app.get('/form', function (req, res) {
res.render('form');
});
app.get('/form_receiver', function (req, res) {
var title = req.query.title;
var description = req.query.description;
res.send(title + ',' + description);
});
app.post('/form_receiver', function (req, res) {
var title = req.body.title;
var description = req.body.description;
res.send(title + ',' + description);
});
app.get('/topic/:id', function (req, res) {
var topics = [
'Javascript is ...',
'Nodejs is ...',
'Express is ...'
];
var output = `
<a href="/topic?id=0">JavaScript</a><br>
<a href="/topic?id=1">Nodejs</a><br>
<a href="/topic?id=2">Express</a><br><br>
${topics[req.params.id]}
`
res.send(output);
});
app.get('/topic/:id/:mode', function (req, res) {
res.send(req.params.id + ',' + req.params.mode)
});
app.get('/template', function (req, res) {
res.render('temp', {time: Date(), title: 'Pug'});
});
app.get('/', function (req, res) {
res.send('Hello home page');
});
app.get('/dynamic', function (req, res) {
var lis = '';
for (var i = 0; i < 5; i++) {
lis = lis + '<li>coding</li>';
}
var time = Date();
var output = `
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
Hello, Dynamic!
<ul>
${lis}
</ul>
${time}
</body>
</html>`;
res.send(output);
});
app.get('/test', function (req, res) {
res.send('Test, <img src="/test.png">')
});
app.get('/login', function (req, res) {
res.send('<h1>Login please</h1>');
});
app.listen(3000, function () {
console.log('Conneted 3000 port!');
});'javascript > node.js' 카테고리의 다른 글
| [Node.js] Node.js 코드 작성시 재실행 안해도 되는 도구 - Supervisor (0) | 2024.07.09 |
|---|---|
| [Node.js] Express, POST 방식을 이용한 정보 전달 - GET과 POST 차이, 용도 (0) | 2024.07.08 |
| [Node.js] Express, POST 방식을 이용한 정보 전달 - FORM (0) | 2024.07.08 |
| [Node.js] Express, URL을 이용하여 시멘틱 URL 사용 (0) | 2024.07.08 |
| [Node.js] Express, URL을 이용하여 query 객체 사용 (0) | 2024.07.08 |
