9 글 보임 - 1 에서 9 까지 (총 9 중에서)
-
글쓴이글
-
2023년 6월 27일 23:55 #88585
이수인참가자안녕하세요. nodejs를 수강하고 있는 수강생입니다. 다름이 아니라 제목 그대로 ajax로 post요청을 보내는 것을 만들고 있다가 발목이 잡혀서 이렇게 글을 남깁니다. 만들고자 하는 post는 회원가입인데, db에 저장할 때 암호화하고자, hash함수를 사용했습니다. 그런데 hash함수부분을 실행할 때 에러가 계속 뜹니다. ajax를 사용 안 하면 정상적으로 잘 되는데 ajax를 사용하니까 계속 에러가 뜨니까 더 잘 모르겠어서 도움을 얻고 싶습니다. 코드가 조금 긴 점 이해해주시면 감사하겠습니다. 먼저 정상적으로 작동되었던 코드를 보여주겠습니다. signUp.ejs입니다. <div class="container mt-3"> <h4 class = "text-center">Sign Up Page</h4> <form action = "/signUp" method="POST"> <div class="form-group"> <label>ID</label> <input type="text" class="form-control" name="newId"> </div> <div class="form-group"> <label>PW</label> <input type="text" class="form-control" name="newPw"> </div> <button type="submit" class="btn btn-danger signUp">Submit</button> </form> </div> 다음은 server코드입니다. app.post('/signUp', function(요청, 응답){ db.collection('loginCounter').findOne( { name : '회원 수' }, function(에러, 결과){ let 총회원수 = 결과.totalmember; db.collection('login').findOne( { id : 요청.body.newId, pw : 요청.body.newPw }, function(에러, 결과){ if(결과 === null){ bcrypt.hash(요청.body.newPw, 8).then(function(암호화된패스워드) { db.collection('login').insertOne( { _id : 총회원수 + 1, id : 요청.body.newId, pw : 암호화된패스워드 }, function(에러, 결과){ 응답.send("<script>alert('회원가입이 완료되었습니다.');location.href='/';</script>"); db.collection('loginCounter').updateOne( { name : '회원 수'}, { $inc : {totalmember:1}}, function(에러, 결과){ if(에러){return console.log(에러)}; }); }) }) }else{ 응답.send("<script>alert('이미 가입된 정보입니다. 다시 입력해주십시오.');\ location.href='/signUp';</script>"); } }) }) }) 위에서 보낸 코드로 하면 정상적으로 회원가입이 진행됩니다. 이제 ajax로 post요청을 하려는 코드를 올리겠습니다. signUp.ejs입니다. <div class="container mt-3"> <h4 class = "text-center">Sign Up Page</h4> <form action = "/signUp" method="POST"> <div class="form-group"> <label>ID</label> <input type="text" class="form-control" name="newId"> </div> <div class="form-group"> <label>PW</label> <input type="text" class="form-control" name="newPw"> </div> <button type="submit" class="btn btn-danger signUp">Submit</button> </form> </div> <script> $('.signUp').click(function(e){ const signId = $('input[name=newId]').val(); const signPw = $('input[name=newPw]').val(); $.ajax({ url : "/signUp", type : "POST", dataType : "JSON", data : { "id" : signId, "pw" : signPw }, }).done(()=>{ //$('.afterLogin').addClass('hidden'); }).fail(function(xhr, textStatus, errorThrown){ console.log(xhr, textStatus, errorThrown); }) }) </script> 다음은 server코드입니다. app.post('/signUp', function(요청, 응답){ db.collection('loginCounter').findOne( { name : '회원 수' }, function(에러, 결과){ let 총회원수 = 결과.totalmember; console.log(요청.body.id) //undefined console.log(요청.body.pw) //undefined db.collection('login').findOne( { id : 요청.body.id, pw : 요청.body.pw }, function(에러, 결과){ if(결과 === null){ bcrypt.hash(요청.body.pw, 8).then(function(암호화된패스워드) { db.collection('login').insertOne( { _id : 총회원수 + 1, id : 요청.body.id, pw : 암호화된패스워드 }, function(에러, 결과){ 응답.send("<script>alert('회원가입이 완료되었습니다.');location.href='/';</script>"); db.collection('loginCounter').updateOne( { name : '회원 수'}, { $inc : {totalmember:1}}, function(에러, 결과){ if(에러){return console.log(에러)}; }); }) }) }else{ 응답.send("<script>alert('이미 가입된 정보입니다. 다시 입력해주십시오.');\ location.href='/signUp';</script>"); } }) }) }) 코드가 정말 길지만 server 코드에서는 바뀐 거라곤 요청.body.newId => 요청.body.id, 요청.body.newPw => 요청.body.pw밖에 없습니다. signUp.ejs에서는 <script>...</script>부분만 추가했습니다. 에러코드도 첨부하겠습니다. Error: data and salt arguments required at Object.hash (/workspace/coding_apple/node_modules/bcrypt/bcrypt.js:137:17) at /workspace/coding_apple/node_modules/bcrypt/promises.js:29:12 at new Promise (<anonymous>) at Object.module.exports.promise (/workspace/coding_apple/node_modules/bcrypt/promises.js:20:12) at Object.hash (/workspace/coding_apple/node_modules/bcrypt/bcrypt.js:133:25) at /workspace/coding_apple/server24.js:261:12 at executeCallback (/workspace/coding_apple/node_modules/mongodb/lib/operations/execute_operation.js:70:5) at handleCallback (/workspace/coding_apple/node_modules/mongodb/lib/utils.js:102:55) at /workspace/coding_apple/node_modules/mongodb/lib/operations/find_one.js:31:9 at /workspace/coding_apple/node_modules/mongodb/lib/utils.js:693:5
코드와 에러 첨부는 이상입니다. 제가 서버로 데이터를 가져오면서 잘못 가져온 것인지, 아니면 ejs파일에서 잘못 작성한 건지, 아니면 hash함수를 잘못 사용한 건지 잘 모르겠습니다. 무엇이 문제인지 최소한의 힌트만 주신다면 계속 고민해보겠습니다. 글이 길었는데 읽어주셔서 감사합니다.
2023년 7월 7일 22:54 #90029
이수인참가자저 코드에서 form태그 안 지우고 이벤트리스너 안에 e.preventDefault()를 썼을 때는 정상적으로 db에 저장이 되고 안 쓰면 500error가 뜹니다. 왜 e.preventDefault를 사용하고 안 하고에 이런 결과가 나오는지 알고 싶습니다.
2023년 7월 8일 22:27 #90130
이수인참가자저번에 요청은 1번만 하시라고 하셨던 것으로 알고 있습니다. 그런데 e.preventDefault()를 써도 결국 요청이 2번 가는 것 아닌가요? 그러면 오류가 떠야하는 것 아닌가요?
-
글쓴이글
9 글 보임 - 1 에서 9 까지 (총 9 중에서)
- 답변은 로그인 후 가능합니다.