Status Codes

0_cyberlover_0·2022년 4월 15일
0

Node.JS # 04

목록 보기
8/19

계정을 생성 했을때 브라우저에서 패스워드를 저장할 거냐고 물어왔다.

그런데 username이나 email이 중복되서 만들어 지지 않았는데도

이런 문구가 뜨는 경우에는 어떻게 해야 할까??

계정이 잘 생성 되었는지 브라우저에서는 알지 못하는것 같다.

그래서 status code(상태코드)라는걸 알 필요가 있다.

콘솔을 확인해 보면 /join페이지에 POST 요청이 있었다고 로그가 찍혀있다.

POST /join 200 38.778 ms - 1072

응답의 상태 코드가 200이라고 나와 있다. 위키피디아에서 상태 코드 200이 뭘 의미 하는지

찾아보면

https://ko.wikipedia.org/wiki/HTTP_%EC%83%81%ED%83%9C_%EC%BD%94%EB%93%9C

200(성공): 서버가 요청을 제대로 처리했다는 뜻이다. 이는 주로 서버가 요청한 페이지를 제공했다는 의미로 쓰인다.

이렇게 결과가 나오고 있다. 구글 크롬에서 usernamepassword정보를 가지고 요청을 보낸 다음에

응답으로 200을 받으면 구글 크롬이 계정 생성이 성공적이었다고 판단하는거다.

그래서 패스워드를 저장할거냐고 물어보는거다.

왜냐하면 크롬에서 form에 입력된 usernamepassword를 보낸걸 알고

계정 생성이 성공적으로 됐다고 판단하면 패스워드를 저장 할거냐고 물어보는거다.

어떻게 구글 크롬이 그렇게 판단할수 있을까? 바로 상태 코드 200을 응답으로 받았기 때문이다.

물론 계정 생성하려는 유저한테는 에러를 보여줬다. 그런데 브라우저는 200을 받았기 때문에

계정 생성이 잘 되었다고 판단하는 거다. 그래서 이걸 바꿔 보도록 한다.

이제 상태 코드 200을 보내지 않을 거다.

만약 res.render()같은걸로 render를 하면 기본적으로 상태 코드 200을 받게 될거다.

그래서 브라우저한테 render는 잘 되었는데 에러가 있었다고 알려 줘야 한다.

그러면 어떤 상태 코드를 쓸수 있는지 한번 본다.

2로 시작하는 모든 상태 코드는 Success를 의미 한다.

200은 OK,Created,Accepted....No Content,Reset Content 같은 것들이 있고,

3으로 시작하는 redirection은 필요 없다.

4로 시작하는 client drrors 바로 이거다.

400 Bad Request 이건 클라이언트에서 발생한 에러 때문에 요청을 처리하지 못할때 쓰면 된다.

4로 시작하는 여러가지 옵션이 있지만 다른것들은 해당이 되지 않으니 400 Bad Request를 사용한다.

그러면 render를 할때 어떻게 상태 코드를 보낼 수 있을까?

res.render()사이에 status(400)을 추가 하기만 하면 된다.

userController.js에서

const exists = await User.exists({ $or: [{ username }, { email }] });
  if (exists) {   
return res.status(400).render("join", {

그래서 이 경우에는 상태코드 400을 가지고 render을 할거다.

그러면 크롬이 뭔가 에러가 있었다는걸 알수 있고 패스워드를 저장할거냐고 물어보지 않을거다.

if (password !== password2) {
    return res.status(400).render("join", {

이곳에서도 에러가 있으니까 여기에도 상태코드 400을 추가 해준다.

 return res.redirect("/login");

그리고 redirect를 한다는건 계정이 잘 생성 되었다는거다.

videoController에서도 에러가 발생하는 경우가 있었다. 예를 들어 upload error가 있었다.

 catch (error) {
    return res.status(400).render("upload", {
      pageTitle: "Upload Video",
      errorMessage: error._message,
    });

여기에도 status(400)을 추가해준다. 여기에서 패스워드를 저장하는 일은 하지 않지만

알맞은 상태 코드를 보내 주는건 정말 중요하다. 그리고 어딘가에서는 404를 써야 할거다.

누가 404에 신경이나 쓰겠어 하겠지만 생각보다 꽤 중요하다.

왜냐하면 예를 들어 브라우저에서 방문한 웹사이트의 히스토리를 저장하는데

어떤 웹사이트를 방문했을때 상태 코드 200으로 응답하면 그 사이트를 방문했다고

히스토레에 기록을 남길거다. 그런데 웹사이트를 방문하고 상태코드 404을 받는다면

브라우저가 그 URL을 히스토리에 남기지 않을거다.

그래서 알맞은 상태 코드를 보내주는게 유저들을 위해 좋을수 있다.

그래야 브라우저가 적절한 행동을 취할수가 있기 때문이다.

브라우저는 이런 에러를 출력하고 있다는걸 모른다.

브라우저에게 이 URL을 기록하지 말라고 알려주는 유일한 방법은 상태코드 404을 보내주는 거다.

const video = await Video.findById(id);
  if (!video) {
    return res.status(404).render("404", { pageTitle: "Video not found." });
    const video = await Video.findById(id);
  if (!video) {
    return res.status(404).render("404", { pageTitle: "Video not found." });
    const video = await Video.exists({ _id: id });
  if (!video) {
    return res.status(404).render("404", { pageTitle: "Video not found." });

꽤 좋은 기능이다. 브라우저 한테 상황을 알려 줄수 있다.

이제는 페이지에서 404코드를 받으면 브라우저가 히스토리에 기록을 남기지 않게 된다.

유저에게 정말 도움이 많이 될거다. 그래서 이번에는 상태코드에 대해 알아 봤다.

이제 브라우저를 닫았다가 다시 켜본다. 이제 패스워드를 저장할건지 물어 보지 않는다.

profile
꿈꾸는 개발자

0개의 댓글