노마드 코더/유튜브 클론

[JavaScript, Node.js] 유튜브 클론 정리 7장 (2) - Validation, Status Code

LooanCheong 2023. 5. 1. 23:44
반응형

머리글

이번 시간에는 중복 ID의 생성을 방지해 보자.

Validation

우선 계정을 아무거나 하나 생성해 준다.

그리고 unique로 지정한 항목의 내용을 똑같이 해서 하나를 더 생성해 보자.

그럼 에러를 만나게 된다.

중복 키 에러

이 에러는 이미 존재하는 데이터를 저장할 때, 발생한다.
unique로 지정한 항목은 하나만 저장이 가능한데, 이를 여러 개 저장하려고 해서 발생한 문제이다.

그러면 계정을 생성할 때, 미리 이를 방지해주어야 한다.

계정을 생성하는 컨트롤러를 조금 수정해서 해결이 가능하다.

export const postJoin = async (req, res) => {
  const { name, username, email, password, password2, location } = req.body;
  const pageTitle = "Join";
  if (password !== password2) {
    return res.render("join", {
      pageTitle,
      errorMessage: "Password confirmation does not match.",
    });
  }
  const exists = await User.exists({ $or: [{ username }, { email }] });
  if (exists) {
    return res.render("join", {
      pageTitle,
      errorMessage: "This username/email is already taken.",
    });
  }
  await User.create({
    name,
    username,
    email,
    password,
    location,
  });
  return res.redirect("/login");
};

2차 비밀번호 항목도 만들어주어, 비밀번호에 대한 에러도 방지가 가능하다.

우선 User 데이터 베이스에 username과 email이 있는지 찾는 함수를 만들어준다.

만약 exists = true 라면,
이미 중복된 항목이 있다는 뜻이므로 계정을 생성하지 않고 다시 가입 페이지로 리턴해준다.

그렇지 않다면,
중복 항목이 없다는 뜻이므로 정상적으로 계정을 생성한다.

그리고 계정을 생성하다 보면,
비밀번호를 저장하겠냐는 문구가 뜨는데 이는 상태 코드와 연관이 있다.

Status Code

위와 같이 뜨는 이유는 브라우저가 상태코드로 200을 받았기 때문이다.

상태 코드 200은 OK를 의미하는 데 있는 그대로의 뜻으로,
문제가 없이 처리가 됐다는 뜻이다.

그런데 우리가 중복 계정을 생성하여 오류가 뜨는 상황에도 그대로 뜨는 것을 볼 수 있다.
그래서 우리는 이를 방지하기 위해 상태 코드도 같이 리턴할 것이다.

이 경우에는 400 코드를 사용할 수 있다.

return res.status(400).render(...)

이런 식으로 간단하게 render 앞에 status 함수를 사용해서 괄호 안에 코드를 보내주게 된다면,
괄호안에 코드에 맞는 상태 코드를 render 함수와 함께 돌려주게 된다.

다양한 상태 코드가 있는데 아래의 문서에서 확인해 보자.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Status

 

HTTP response status codes - HTTP | MDN

HTTP response status codes indicate whether a specific HTTP request has been successfully completed. Responses are grouped in five classes:

developer.mozilla.org

마무리

이번 시간에는 계정의 중복 생성 방지와 상태 코드에 대해서 알아보았다.

다음 시간에는 로그인을 좀 더 본격적으로 다뤄보자.

반응형