Nodemon delay로 인한 Express.js & React.js 서버 문제 해결

NPM 패키지인 reactjs-express-generator에서 passport.js로 인증을 넘기려고 하는데 지속적으로 서버가 재 구동되는 문제 때문에 OAuth Token을 전송받지 못하여 인증 시스템이 작동하지 않는 문제가 발생하였습니다. 처음에는 reactjs-express-generator 자체의 문제인줄 알고 Github의 Issue 항목에도 글을 남겨보고 Stackoverflow도 검색해보았으나 해당 항목의 문제점이 어디서 발생하는 것인지 찾기 힘들었습니다. 그래서 reactjs-express-generator를 사용하지 않고 다른 방법을 찾아볼까도 생각했지만 혹시 Node.js 앱을 구동하는 Nodemon에서 문제가 발생할 수 있지 않을까 하는 생각이 들었습니다. 왜냐하면 웹사이트에서 어떤 이벤트가 발생할 때마다 nodemon이 지속적으로 재시작되었고 이 부분에서 연결이 끊어져 문제가 발생할 수 있다고 생각했기 때문입니다.

 

항상 드는 생각이지만 개발 도중에 오류가 발생하는 곳은 무궁무진하기 때문에 그 부분을 찾기가 참 어려운 것 같습니다.

 

발생하는 문제는 아래와 같습니다.

이런식으로 중간에 서버가 종료되었다가 다시 연결되는탓에 Bad Request 상태를 보여줍니다.

하지만 지속적으로 문제가 발생하는 것은 아니고 가끔씩 아래와 같이 제대로 연결되는 경우도 있습니다.

 

해당 문제는 Nodemon이 babel-node를 몇 초 뒤에 계속 업데이트하면서 발생하는 문제라고 합니다.

 

[해결 방법]

Nodemon의 delay 옵션을 넣어주면 됩니다.

Package.json 파일에서 scripts 항목의 nodemon 옵션에서 --delay 2 (또는 이상)로 지정해주시면 됩니다.

 

"scripts": {
    "server": "nodemon app.js --exec babel-node --delay 2",
    "react": "webpack",
    "start": "concurrently \"npm run react\" \"npm run server\""
  }

 

[참고 문서]

https://stackoverflow.com/questions/39917343/nodemon-babel-restart-the-server-multiple-times