본문 바로가기
Programming

[Server] express Router 분리 사용법

by 개발자 염상진 2022. 5. 27.

 

express Router

 

express 프레임워크를 사용하는 가장 큰 이유 중 하나가 깔끔한 Router 때문이다. express에서 라우터를 사용하기 위해서는 express 인스턴스에 HTTP 메소드를 호출하거나 path를 첫번째 인자로 지정해주면 된다.

 

app.get('/router', (req,res)=>{
	console.log("기본적인 라우터");
})

 

하지만 모든 라우팅을 이런 방식을 코드를 작성하는 경우 app.js가 불필요하게 길어지게 된다. 이런 이유로 routes 폴더를 만들고 라우터를 분리하기 시작한다.

 

라우터 분리

 

 

라우터 분리를 위해 먼저 routes 디렉토리를 생성하고 index.js, user.js 파일을 생성한다.

$ mkdir routes
$ touch routes/index.js
$ touch routes/user.js

 

routes/index.js

const express = require('express');

const router = express.Router();

router.get('/', (req, res)=>{
    res.send("Hello Router !");
})

module.exports = router;

 

routes/user.js

const express = require('express');

const router = express.Router();

router.get('/', (req, res)=>{
    res.send("Hello User !");
})

module.exports = router;

 

routes/ 디렉토리 내 생성한 두개의 라우터를 app.js에 연결한다.

// 라우터 module
const indexRouter = require('./routes/index');
const userRouter = require('./routes/user');

// 라우터 module 호출
app.use('/', indexRouter);
app.use('/user', userRouter);

 

 

next('route') 함수 바로 이동

next() 함수를 호출 할 때 매개변수로 route를 전달하면 다음 라우터로 바로 이동한다. 아래 예제에서 TEST1, TEST2는 console에 찍히지 않는다.

 

const express = require('express');

const router = express.Router();

router.get('/', (req, res, next)=>{
    next('route')
},(req, res, next)=>{
    console.log("TEST1") // 실행 안됨
    next();
},(req, res, next)=>{
    console.log("TEST2"); // 실행 안됨
    next();
})
router.get('/', (req, res)=>{
    res.send("Hello Router !"); // 실행 됨
})


module.exports = router;

 

 

라우트 매개변수 사용

라우터 주소에는 정규표현식을 포함해 특수 패턴을 사용할 수 있다. 자주 쓰이는 패턴 중 하나가 라우트 매개변수다. /user/About-Tech 라는 URI가 요청되었을 때 id 값에 About-Tech가 저장된다. req.params.id 를 통해 라우트 매개변수에 접근이 가능하다. 

 

router.get('/user/:id', (req, res)=>{
	console.log(req.params.id);
})

 

라우터 매개변수를 사용할 때는 일반 라우터 뒤에 위치해야 한다. 다양한 라우터를 포함한 와일드카드 역할을 하기 때문에 일반 라우터 보다 뒤에 와야 정상 작동한다. 

 

router.get('/user/:id', (req, res)=>{
	console.log(req.params.id);
})

router.get('/user/like', (req, res)=>{
	console.log("Hello Like"); // 실행되지 않음
})

 

 

 

쿼리 스트링 사용

URI에 쿼리 스트링을 사용해서 쿼리 스트링 정보를 가져올 수 있다. 쿼리 스트링 데이터는  req.query 객체 안에 들어있다.

router.get('/user?id=123&name=About-Tech', (req, res)=>{
	console.log(req.query.id, req.query.name); // {id : 123, name : About-Tech}
})

 

router.route() 사용

path는 동일하지만 메소드만 다른 경우 하나의 덩어리로 만들어 줄 수 있다.

 

주소는 /abc로 동일하지만 GET, POST 메소드로 분기되는 경우다.

router.get('/abc', (req, res)=>{
	res.send("GET 메소드"):
})

router.post('/abc', (req, res)=>{
	res.send("POST 메소드"):
})

 

위 코드를 router.route()를 사용해서 한 덩이의 코드로 변경해줄 수 있다.

router.route('/abc')
	.get((req, res)=>{
    	res.send("GET 메소드"):	
    })
    .post((req, res)=>{
    	res.send("POST 메소드"):	
    })

 

Router 에러 핸들링

 

app.js에서 에러 처리 미들웨어 위에 넣어뒀던 미들웨어는 일치하는 라우터가 없는 경우 404 상태 코드를 응답하게 된다. 미들웨어가 존재하지 않으면 express에서 자체적으로 404 에러를 처리하지만 가능하면 404 응답 미들웨어와 에러 처리 미들웨어를 연결해주는 것이 좋다.

 

app.use((req, res, next)=>{
	res.status(404).send('Not Found');
})

 

 

 

 

 

[Server] express 서버 시작하는 방법, 미들웨어 종류

Express Node.js에서도 HTTP 요청과 응답을 처리할 수 있는 HTTP 모듈을 제공한다. 그럼에도 불구하고 코드가 보기 힘들고, 확장성이 떨어지기 때문에 npm에서 서버를 제작하는 웹 서버 프레임워크 Expres

about-tech.tistory.com

 

 

[Web Server] fetch API 사용하는 방법

fetch API 사용하는 방법 fetch는 프론트에서 서버로 리소스를 요청하기 위해서 Javascript에 내장된 Promise 함수다. 기본적으로 비동기 태생을 지닌 녀석이기 때문에 Javascript가 아닌 Node.js나 웹 브라우

about-tech.tistory.com

 

 

[Algorithm] Javascript Graph 자료구조 인접행렬(Adjacency Matrix) 구현하기

How to implement Graph Data Structure in Javascript? Graph 인접행렬 구현하기 그래프(Grpah) 자료구조는 노드를 간선으로 연결해 관계를 표현할 수 있는 자료구조다. 네비게이션에서 최단거리를 구하는 알고..

about-tech.tistory.com

 

댓글