항해 99 5기 TIL_80

▶ Today I Learned

 

<실전 프로젝트>

 

[새로운 뱃지 지급 알람]

 

새로운 뱃지가 생기면 생기고 나서 최초 1번만 마이페이지에 들어가면 새로운 뱃지가 열렸다는 알람이 뜨도록 했다.

 

처음 짰던 코드는 다음과 같다.

let newBadge = 0; // UserController에 전달될 newBadge 전역변수 저장

module.exports = {
  create: {
    local: asyncWrapper(async (req, res) => {
@@ -165,13 +167,14 @@ module.exports = {
            await user.addMyBadges(
              firstComeBadge.id
            );
            newBadge = firstComeBadge.id 

            res.status(200).json({
              isSuccess: true,
              data: {
                token,
                newBadge: firstComeBadge,
              },
              // newBadge: firstComeBadge,
            });
          } else {
            res.status(200).json({
@@ -255,14 +258,19 @@ module.exports = {
      console.log("leftBadge", leftBadge)

      if (isGivenBadge.length === 0 && user.type === "local" && 0 < leftBadge) {

        await firstComeBadge.decrement("leftBadges");
        console.log("decrement가 실행되었다ㅏㅏㅏㅏㅏㅏ")
        await user.addMyBadges(firstComeBadge.id);
        newBadge = firstComeBadge.id


        return res.status(200).json({
          isSuccess: true,
          data: {
            token,
          },
          newBadge: firstComeBadge

        });
      } else {
        return res.status(200).json({
@@ -273,7 +281,14 @@ module.exports = {
        });
      }
    }),
    newBadge: () => {
      return newBadge;
    },
    newBadgeInit: () => {
      newBadge = 0;
    },
  },

 

이처럼 newBadge를 지급해주는 파일에 전역 변수로 만들어 놓은 다음 newBadge라는 함수를 userController파일에서 호출하여

뱃지 목록을 조회하도록 한다.

여기서 newBadge에 값이 있으면 프론트측에 newBadge라는 항목을 보내주고newBadgeInit 함수를 호출하여 값을 0으로 초기화 해준다. 목록 조회 시 값이 0(없다는 뜻으로 지정)이면 프론트 측에 newBadge라는 항목 자체를 보내주지 않는다.

 

하지만 이 방법을 사용한 결과 문제가 발생했다.

a와 b가 회원가입을 하고 로그인을 하여 뱃지를 지급받은 상태라고 가정하자.

a와 b모두 서버상에서 newBadge에 자신들이 받은 뱃지 아이디가 들어가있다.

a가 먼저 마이페이지에 들어가 보유뱃지 목록 조회를 하면서 newBadge는 초기화된다.

문제는 a와 b가 newBadge를 같이 쓰기 때문에 b가 그 다음으로 마이페이지에 들어가면 새로운 뱃지 알람이 뜨지 않는다는 것이다..

 

이를 해결하고자 고유한 유저의 newBadge가 서로에게 영향을 끼치지 않도록 DB 내 User테이블에서 새롭게 newBadge라는 열을

만들도록 했다.

newBadge에 값이 null이라면 프론트에 newBadge를 넘겨주지 않고 값이 무엇이라도 있다면 그 값을 newBadge라는 항목에 담아 넘겨주기로 했다.

 

로그인 컨트롤러 측 코드

     await user.addMyBadges(categoryBadge.id);
     await user.update({newBadge: categoryBadge.id})

뱃지 목록 조회하는 유저 컨트롤러 측 코드

 

 // newBadge가 있으면 숫자, 없으면 null 값임
      const newBadge =  await User.findOne({
        where: {
          id: user.id
        },
        attributes: ["newBadge"]
      })
      
      // newBadge 가 있는 경우
      if (newBadge.dataValues.newBadge !== null ) {

        res.status(200).json({
          isSuccess: true,
          data: badges,
          newBadge: newBadge.dataValues.newBadge
        });

        // 값 넘겨주고 나서 해당 유저의 newBadge 칼럼 초기화
        await User.update({
          newBadge: null
        }, 
        {
          where: {
            id: user.id
        }})
        
      } else { // newBadge로 넘어온 것이 없는 경우
        res.status(200).json({
          isSuccess: true,
          data: badges,
        });
      }
    }),

 

이렇게 하였더니 문제는 말끔히 해결되었다!

로직을 하나하나 차분히 파악하고 해결하게 되어 뿌듯하다 히히

 

[req.query]

 

page라는 변수에 1이 담겨 req.query로 전달되는 부분에서

page === 1 가 false가 나왔다...

원인을 알지 못했는데 console.log를 찍어보니 알 수 있었다.

 

console.log(page, "page는 이것이다ㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏ")
      console.log(typeof page, "type을 확인해보자ㅏㅏㅏㅏㅏㅏㅏ");
      console.log(page === 1, "page === 1는 참인가 거짓인가");
      console.log(page/1 === 1, "page/1 === 1는 참인가 거짓인가");

결과는

1 page는 이것이다ㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏㅏ
string type을 확인해보자ㅏㅏㅏㅏㅏㅏㅏ
false page === 1는 참인가 거짓인가
true page/1 === 1는 참인가 거짓인가

즉, 1이 문자열로 넘어오는 것이었다.

이유는 아래의 링크에서 알 수 있었다.

 

"중요 : 기본적으로 이러한 쿼리 매개 변수에서 무언가를 추출 하는 경우 URL이오고 텍스트로 처리되므로 항상 문자열 이됩니다."

 

출처:

http://daplus.net/node-js-node-js-req-query-%EC%99%80-req-params%EC%9D%98-%EC%B0%A8%EC%9D%B4%EC%A0%90/

 

문제 해결! ;)

 

 

▶ 느낀 점

 

오늘도 정신없이 지나간 하루였다.

실전 프로젝트 끝 기간이 다가올 수록 다들 막판 스퍼트를 달리는 데 열심이다.

서비스 배포 직전 오류도 생각보다 많이 보여서 골치였긴하지만

오늘도 내일도 열심히 대응해본다 :)

 

▶ 공부 시 참고 링크들

 

https://gmlwjd9405.github.io/2018/05/18/git-stash.html

[Git] git stash 명령어 사용하기 - Heee's Development Blog

 

https://yonghyunlee.gitlab.io/node/node-schedule/

특정 시간에 이벤트 발생시키기 - Node.js - 김땡땡's blog