Uksssssssss
60
2020-03-27 03:55:51
0
78

응답상태코드에 따른 ajax를 다른방식으로 줄 수 있는 방법이 없을까요?


입력한 데이터와 DB에서 가져온 데이터값이 일치하지 않는 경우 '잘못된 아이디나 비밀번호를 입력하셨습니다.'가 나오게 하고 싶습니다. 일치하는 경우엔 session에 등록하고 '/'페이지로 보내는데, 일치하지 않는 경우와 그 경우에서 login버튼을 눌렀을 시 ajax와 연결하는 방법을 어떻게 하면 좋을까요?

응답 상태 코드에 따라 만약 res.status(204)이면 클릭 했을 때 ajax.js에서 else if문을 타고 들어가 innerHTML로 넣을 수 있을 줄 알았지만 아니네요... 혹시 다른 방법이 있을까요? 

질문을 요약하자면 '입력데이터와 DB데이터가 일치하지 않을 때, 어떻게하면 ajax.js의 else if 이후의 코드와 바인딩 시킬 수 있는지'입니다.

//main.js

app.post('/login_process', (req, res, next) => {
var email = req.body.userId;
var password = req.body.userPassword;
console.log("Information received !");

db.query('SELECT mem_email, mem_password FROM Authentication', function(err, result) {
if(err) {throw err}

var emailFromDB = result[0].mem_email;
var passwordFromDB = result[0].mem_password + ""; // convert int -> string

if(email === emailFromDB && password === passwordFromDB) {
console.log('if ok')
req.session.is_logined = true;
req.session.save(() => {
res.redirect(`/`);
});
} else {
res.status(204);
res.end();
}
});
});


//ajax.js
var insertedData = {
"email" : document.loginForm.userId.value,
"password" : document.loginForm.userPassword.value
}


document.querySelector('#login .login .check').addEventListener('click', function(event) {
var xhr = new XMLHttpRequest();
xhr.open('POST', '/login_process', true);

xhr.onreadystatechange = function(){ // 웹 서버로부터 응답이 도착하면 특정한 자바스크립트 함수를 호출하는 기능
if(xhr.readyState === 4 && xhr.status === 200){
console.log(xhr.status);
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhr.send(JSON.stringify(insertedData));
} else if(xhr.status === 204) {
console.log(xhr.status);
// xhr.open('GET', '/login', true);
var signUp = document.querySelector('#login .login .target');
signUp.innerHTML = '잘못된 아이디나 비밀번호를 입력하셨습니다.';
xhr.send();
}
}
});

0
0
  • 답변 0

  • 로그인을 하시면 답변을 등록할 수 있습니다.