상세 컨텐츠

본문 제목

node js / express 이용하기 / 라우팅

프레임워크+라이브러리/Express

by moonionn 2020. 7. 30. 23:26

본문

Router()

express에서 라우팅처리를 하는 방법 중에 Router() 함수를 호출하는 방법이 있습니다.

const router = express.Router();

 

app.get(), app.post(), app.put(), app.delete() 등을 이어서 쓰다 보면

코드가 길어지기 때문에 각 url 주소마다 작동시키고 싶은 기능들을 정한 뒤

라우터 모듈 안에 담아 export하면 다른 파일에서 이용할 수 있습니다.

const express = require('express');
const router = express.Router();

// '/' 주소로 request 들어올 시 get
router.route('/').get((req, res) => {
  res.send(html);
});

// '/name' 주소로 request 들어올 시 post
router.route('/name').post((req, res) => {
  const paramName = req.body.name
  res.send(`어서오세요 ${paramName}님`);
});

// router 모듈 export
module.exports = router;

 

 

아래는 다른 파일에서 해당 router 모듈을 불러와 사용한 모습입니다.

페이지도 잘 동작하는 걸 확인할 수 있습니다.

const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const router = require('./routerModule.js');
const html = `
<form action="/name" method="POST">
  <input type="text" name="name" placeholder="이름을 적어주세요">
  <button>확인</button>
</form>`;

app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());

// 라우터 사용하기
app.use('/', router);

app.listen(8004, () => {
  console.log('서버 구동중');
});

 

url 파라미터 이용하기

예시)

http://localhost:8004/name/:parameter-name

요청 path에 parameter 값이 포함되도록 할 수 있으며 
이를 페이지 내에서 응용할 수도 있습니다.

기존 상단에 쓰였던 코드에서 이름을 등록하는 시간에 따라서 인사말이

good morning, good afternoon, good evening, good night으로 바뀌도록 수정해보려 합니다.

const nowHour = new Date().getHours();
let say = '';

if (nowHour > 6 && nowHour <= 12)
  say = 'Good morning'
else if (nowHour > 12 && nowHour <= 16)
  say = 'Good afternoon'
else if (nowHour > 16 && nowHour <= 21)
  say = 'Good evening'
else
  say = 'Good night';
const html = `
<form action="/name/${say}" method="POST">
  <input type="text" name="name" placeholder="이름을 적어주세요">
  <button>확인</button>
</form>`;

form이 post할 url path 맨 뒤에 인사말 변수인 say를 넣습니다.

따라서 페이지를 실행하는 시간에 따라 페이지 주소가 변할 것입니다.

 

router.route('/name/:say').post((req, res) => {
  //👇form 에서 받은 정보
  const paramName = req.body.name;
  //👇파라미터에서 받은 정보
  const paramSay = req.params.say;
  res.send(`${paramSay}, ${paramName}님`);
});

라우트 값을 '/name/:say' 로 해놓으면 파라미터 안에 say라는 key와 그 value가 형성됩니다.

실제로 콘솔에 req.params를 찍어보면 { say: 'Good night' } 이런 값이 나옵니다.

 

결과

//전체 코드
//routerModule.js 파일

const express = require('express');
const router = express.Router();

const nowHour = new Date().getHours();
let say = '';

if (nowHour > 6 && nowHour <= 12)
  say = 'Good morning'
else if (nowHour > 12 && nowHour <= 16)
  say = 'Good afternoon'
else if (nowHour > 16 && nowHour <= 21)
  say = 'Good evening'
else
  say = 'Good night';

const html = `
<form action="/name/${say}" method="POST">
  <input type="text" name="name" placeholder="이름을 적어주세요">
  <button>확인</button>
</form>`;

router.route('/').get((req, res) => {
  res.send(html);
});

router.route('/name/:say').post((req, res) => {
  const paramName = req.body.name;
  const paramHello = req.params.say;
  console.dir(req.params);
  res.send(`${paramHello}, ${paramName}님`);
});

module.exports = router;
//전체 코드
//routerModule.js를 받아 사용

const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const router = require('./routerModule.js');

app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());

app.use('/', router);

app.listen(8004, () => {
  console.log('서버 구동중');
});

 

404 에러 처리하기

사용자가 지정되지 않은 url에 접속하려 한다면 에러 메세지를 보내야 합니다.

express에서는 아래와 같은 방법으로 처리합니다.

const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const router = require('./routerModule.js');

app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());

app.use('/', router);

//라우터에서 설정되어 있지 않은 주소로 접속하려 할때
app.all('*', (req, res) => {
  res.status(404).send('PAGE NOT FOUND');
});

app.listen(8004, () => {
  console.log('서버 구동중');
});

주소창에 설정해두지도 않은 Good day 값을 쳐보니

Status가 404로 바뀌며 PAGE NOT FOUND가 출력되는 걸 확인할 수 있습니다.

관련글 더보기

댓글 영역