Express.js_router 경로 오타 이슈(app -> router)

trouble smashing log

Time: 2023-01-02 21:20

Problem

프론트 단에서 POST 메소드로 /api/users 경로에 보낸 요청이 404 에러가 발생했다.

...
const app = express();
const router = express.Router();

app.use('/api', express.urlencoded({ extended: false }), router);
app.use(express.static('assets'));

app.post('/users', async (req, res) => {
    const { email, password } = req.body;    
...

Cause

분명히 경로를 만들어주었는데도, 왜 404에러가 발생했을까. 처음에는 API의 경로 /users 에 /api 주소가 생략되서 그런가 했는데, 라우터가 아니라 app으로 시작했던 것이 문제였다.

추정

/api 경로를 관리하는 urlencoded() 미들웨어를 거친 뒤 router로 넘어가는 것 같은데, 문제는 이를 넘겨 받아야 하는 app.post('/users')가 어플리케이션 레벨이었기에 못받은 것 같다.

블로그에 따르면 미들웨어는 크게 어플리에키션 레벨에서 라우터 레벨로 넘어가는데, 위의 경우 어플리케이션 레벨에서 라우터로 넘어가려는 것을 어플리케이션 레벨에서 받으려니 문제가 된 것 같다.

Solution

app.post('/users', ...) -> router.post('/users', ...)
app.post()를 router.post()로 바꿔주니 정상적으로 req.body를 받아올 수 있게 되었다.

So what

API를 처음 쌓을 때 app과 router를 혼동하지 말 것!

Related articles

https://stackoverflow.com/questions/41836310/difference-between-app-get-or-router-get-expressjs
https://morian-kim.tistory.com/3