[NodeJS] - Express, POST 방식을 이용한 form 데이터 전달
○ Express, POST 방식을 이용한 form 데이터 전달 |
<form> 태그 안에서의 name 으로 지정한 값들을 req.body.name 으로 가져와 사용한다 !!! (post 방식은 header가 아니라 body에 데이터를 싣기 때문) post 방식을 사용하기 위해 아래와 같이 모듈을 가져오고 사용한다고 해줘야한다! var bodyParser = require('body-parser'); app.use(bodyParser.urlencoded({extend : false})); res.render() : ejs(html) 파일을 보여줄 때 사용 res.send() : 지정한 값을 뿌려줄 때 사용 // form.ejs <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <form action="/form_receiver" method="post"> // method="post" : post 방식 <p><input type="text" name="title"></p> <p><textarea name="desc"></textarea></p> <button type="submit">전송</button> </form> </body> </html> // app.js var express = require('express'); var app = express(); // 위에서 가져온 express 모듈이 함수여서, 이렇게 가져와 사용한다 var ejs = require('ejs'); // html 랜더링 var bodyParser = require('body-parser'); // post 전송방식 사용하기 위해 app.set("views", __dirname); // ejs 파일 가져올 폴더 지정(프로젝트명) 및 ejs 관련 설정 app.set("view engine", "ejs"); app.engine("ejs", ejs.renderFile); app.use(bodyParser.urlencoded({extend : false})); // use() 를 통해 연결 시킨다! (사용하기 위해) app.get('/', function(req, res){ res.send("3050 포트에 연결 성공했어요!"); }); app.get('/form', function(req, res){ res.render('form.ejs'); // ejs(html)파일 보여줄 때 이렇게 render() 사용 }); app.post('/form_receiver', function(req, res){ var title = req.body.title; var desc = req.body.desc; res.send("제목 : " + title + "\n" + "내용 : " + desc); // 사용자에게 지정한 값을 응답해줌 }); app.listen(3050, function(){ console.log("3050번 포트에 연결 성공!"); }); // 3050번 포트를 listening, 리스닝 성공 시 콜백메소드 실행하여 메시지 출력 |
'NodeJS' 카테고리의 다른 글
[NodeJS] - pm2 설치하여 서버가 죽지 않고 계속 유지시키기 (0) | 2018.10.16 |
---|---|
[NodeJS] - Supervisor 설치하여 코드 변경 시 자동으로 서버를 리로드 (0) | 2018.10.16 |
[NodeJS] - Express, GET 방식을 이용한 form 데이터 전달 (0) | 2018.10.15 |
[NodeJS] - 동기(Sync)와 비동기(Async) (0) | 2018.10.15 |
[NodeJS] - Express 이용하여 웹앱 만들기(2) : ejs와 res.render() 사용 (0) | 2018.10.15 |