• 카테고리

    질문 & 답변

  • 세부 분야

    풀스택

  • 해결 여부

    해결됨

라우터 분리시킨 후, post 로 보낸 데이터를 못받아주는 문제가 생겨서 질문드리고 싶습니다

22.05.18 14:48 작성 조회수 229

0

선생님 안녕하세요

라우터를 분리시키기 전에는 req.body가 post 로 보낸 데이터를 잘 받아줬습니다

그런데, 라우터를 분리시킨 다음에, post 로 보낸 데이터를 body가 못받아줘서 원인을 잘 모르겠어서 질문드리고 싶습니다

가르쳐주시면 정말 감사하겠습니다

 

먼저 폴더와 파일 위치입니다

 

 

 

url 에 localhost:3001 입력을 하면

먼저 app.js에서

 

이렇게 라우팅과 랜더링을 해줘서 signup.html 이 나옵니다

그리고 여기서 회원가입 버튼을 눌러봤습니다

누르면 

이렇게 signup의 email nickname passwd가

manager.js 의 req.body.email, req.body.nickname에 전달될 줄 알았습니다

그러나 에러가 생겼습니다

 

라우터 분리 전에는 이런 일이 없었어서 혹시 원인을 가르쳐주시면 정말 감사하겠습니다

긴 질문을 읽어주셔서 고맙습니다

 

 

아래는 소스코드입니다

signup.html

<html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>회원가입 정보 입력란</title>
  </head>
  <style>
  .inputSubmit{
       color:red; background-color: white; border-radius : 10%
      }
  </style>  
  <body bgcolor="#FFFFFF">
  <div align=center>
  <H2>회원가입 정보 입력란</H2>
  <HR>
  <form method="post" action="/add" name="form1">
   <table width="650" border="0" align="center" cellspacing="0" cellpadding="5">
   <tr><td>이메일</td><td><input type="text" name="email" size=30></td></tr>
   <tr><td>닉네임</td><td><input type="text" name="nickname" size=30></td></tr>
   <tr><td>비밀번호</td><td><input type="password" name="passwd" size=30></td></tr>
   <tr><td colspan="2" align="center"> <input type="submit" name="Submit3" value="회원가입" class="inputSubmit"  id ='Submit3' onclick="document.querySelector('#Submit3').style.backgroundColor='grey'"></td></tr>
   </form>

  </table>
  </div>
  </body>
  </html>

 

manager.js

const express = require(`express`);
const path = require('path');
const morgan = require('morgan');
const nunjucks = require('nunjucks');
const router = express.Router();

const { sequelize } = require('../models');
const {User} = require('../models');
const { userInfo } = require('os');
const { isNativeError } = require('util/types');

const app = express();
app.set('view engine', 'html');
nunjucks.configure('../views', {
  express: app,
  watch: true,
});
sequelize.sync({ force: false })
.then( () => {
  console.log("DB connected");
})
.catch( (err) => {
  console.error(err);
})


router.get('/',(req,res,next)=>{
    res.render('signup',{});
  })
  
router.post('/add',(req,res,next)=>{
console.log(req.body.nickname);
console.log(req.body.email);
  try{
    if(req.body.email)
    {
      User.create({
      email: req.body.email,
      nickname: req.body.nickname,
      password: req.body.passwd,
      });
      res.redirect('/');
    }
  }
  catch(error)
  {
    console.log(error);
    next(error);
  }
  })
  
module.exports = router;

 

 

app.js 입니다

/**
 * app.js
 */

const express = require('express');
const path = require('path');
const morgan = require('morgan');
const nunjucks = require('nunjucks');

const { sequelize } = require('./models');
const {User} = require('./models');
const { userInfo } = require('os');
const { isNativeError } = require('util/types');
const managerRouter = require('./routes/manager');
// const indexRouter = require('./routes');
// const usersRouter = require('./routes/users');

const app = express();
app.set('port', process.env.PORT || 3001);
app.set('view engine', 'html');
nunjucks.configure('views', {
  express: app,
  watch: true,
});
sequelize.sync({ force: false })
.then( () => {
  console.log("DB connected");
})
.catch( (err) => {
  console.error(err);
})

app.use('/', managerRouter);
app.use(morgan('dev'));
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));

app.use((req, res, next) => {
  const error =  new Error(`${req.method} ${req.url} 라우터가 없습니다.`);
  error.status = 404;
  next(error);
});

app.use((err, req, res, next) => {
  res.locals.message = err.message;
  res.locals.error = process.env.NODE_ENV !== 'production' ? err : {};
  res.status(err.status || 500);
  res.render('error');
});

app.listen(app.get('port'), () => {
  console.log(app.get('port'), '번 포트에서 대기 중');
});

 

 

 

 

course-thumbnail

[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지

답변 1

답변을 작성해보세요.

1

조현영님의 프로필

조현영

지식공유자

2022.05.18

미들웨어 순서 조심하라고 말씀드렸죠?

라우터가 express.json, express.urlencoded 보다 위에 있으면 라우터에는 이게 적용 안 됩니다.

Like me black님의 프로필

Like me black

질문자

2022.05.18

선생님 가르쳐주셔서 감사합니다
가르쳐주신대로 이렇게 해봤습니다

그러자 ,같은 에러는 해결되었는데,
아직 해결되어야 하는 에러가 있는 것 같았습니다

회원가입 버튼을 누르자




이런 에러가 생겼습니다
unique constraint error를 검색해봤는데, 원하는 정보를 얻지 못해서
번거로우시겠지만 도와주시면 정말 감사하겠습니다

 

아래는 소스코드입니다
app.js

/**
 * app.js
 */

const express = require('express');
const path = require('path');
const morgan = require('morgan');
const nunjucks = require('nunjucks');

const { sequelize } = require('./models');
const {User} = require('./models');
const { userInfo } = require('os');
const { isNativeError } = require('util/types');
const managerRouter = require('./routes/manager');
// const indexRouter = require('./routes');
// const usersRouter = require('./routes/users');

const app = express();
app.set('port', process.env.PORT || 3001);
app.set('view engine', 'html');
nunjucks.configure('views', {
  express: app,
  watch: true,
});
sequelize.sync({ force: false })
.then( () => {
  console.log("DB connected");
})
.catch( (err) => {
  console.error(err);
})

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

app.use('/', managerRouter);
app.use(morgan('dev'));
app.use(express.static(path.join(__dirname, 'public')));


app.use((req, res, next) => {
  const error =  new Error(`${req.method} ${req.url} 라우터가 없습니다.`);
  error.status = 404;
  next(error);
});

app.use((err, req, res, next) => {
  res.locals.message = err.message;
  res.locals.error = process.env.NODE_ENV !== 'production' ? err : {};
  res.status(err.status || 500);
  res.render('error');
});

app.listen(app.get('port'), () => {
  console.log(app.get('port'), '번 포트에서 대기 중');
});

 

아래는

manager.js 입니다

const express = require(`express`);
const path = require('path');
const morgan = require('morgan');
const nunjucks = require('nunjucks');
const router = express.Router();

const { sequelize } = require('../models');
const {User} = require('../models');
const { userInfo } = require('os');
const { isNativeError } = require('util/types');

const app = express();
app.set('view engine', 'html');
nunjucks.configure('../views', {
  express: app,
  watch: true,
});
sequelize.sync({ force: false })
.then( () => {
  console.log("DB connected");
})
.catch( (err) => {
  console.error(err);
})
app.use(express.json());
app.use(express.urlencoded({ extended: false }));

router.get('/',(req,res,next)=>{
    res.render('signup',{});
  })
  
router.post('/add',(req,res,next)=>{
console.log(req.body.nickname);
console.log(req.body.email);
  try{
    if(req.body.email)
    {
      User.create({
      email: req.body.email,
      nickname: req.body.nickname,
      password: req.body.passwd,
      });
      res.redirect('/');
    }
  }
  catch(error)
  {
    console.log(error);
    next(error);
  }
  })
  
module.exports = router;



오늘 너무 많은 질문을 드려서 죄송합니다 ㅠㅠ

Like me black님의 프로필

Like me black

질문자

2022.05.18

이 unique constraint 에러가 골때리는 게, 언제는 되고 언제는 이 에러가 뜹니다
5번 중 2번은 되고 3번은 안됩니다
컴퓨터는 기계니까 이럴 수가 없는 건데요

Like me black님의 프로필

Like me black

질문자

2022.05.18

그런데 신기한 현상을 발견했습니다
db를 아예 삭제하고 다시 시작하니 잘됩니다

Like me black님의 프로필

Like me black

질문자

2022.05.18

원인을 찾았습니다 고맙습니다

Like me black님의 프로필

Like me black

질문자

2022.05.18

제가 db를 soft delete로 설정해서
삭제 날짜만 생기고, 실제로 레코드가 지워지진 않았습니다
삭제 기록만 있고, 실제로 레코드가 지워지지 않은 이메일과 똑같은 이름으로 회원가입하면 에러가 생겼습니다


회원가입할 때 qweqe@naver.com 으로 가입하면 문제가 생기는 거였네요

Like me black님의 프로필

Like me black

질문자

2022.05.18

그렇다면 같은 이메일로 회원가입을 하면 에러처리를 해주는 소스코드를 추가해야 겠군요..!
해결되었습니다
고맙습니다 선생님ㅎㅎ 

Like me black님의 프로필

Like me black

질문자

2022.05.18

선생님 저 라우터 분리 관련해서 하나만 더 질문드려도 될까요? ㅠㅠ


app.js에서만 console.log( ) 콘솔출력이 되고

routes 폴더 안에 있는 .js 파일 안에서는 console.log( )를 해도 콘솔출력이 안보이더라구요

제가 console.log( ) 로 디버깅을 하는 것을 선호해서요

vs code에서도 디버그 모드에서

routes 폴더 안에 있는 js 파일들은 한줄 한줄 실행해주지도 않더라구요

그렇다면 이렇게 라우터화 시키면 디버깅 방법이 없는지가 궁금합니다

조현영님의 프로필

조현영

지식공유자

2022.05.18

아뇨 실행되어야 정상입니다. 실행 안 되는 것은 파일이 연결이 되지 않았거나 routes폴더 내의 코드가 실행이 되지 않았기 때문입니다.

Like me black님의 프로필

Like me black

질문자

2022.05.18

아 그러면 다시 확인해보겠습니다
많은 질문 받아주시고 가르쳐주셔서 정말 감사합니다

이 글과 비슷한 Q&A