WIL_10주차

🐰 익명 커뮤니티 팀 프로젝트를 시작했다. 로그인, 로그아웃 구현을 맡았다.
로그아웃 구현할 때 블랙리스트를 사용해서 구현하는 경우가 굉장히 많았다. 그 중 대부분이 레디스를 이용해 구현을 했는데 전 팀원분이 블랙리스트만을 써서 구현에 성공하셔서 참고해서 코드를 작성해 보았다.

로그아웃 블랙리스트

백 부분에서는 잘 구현이 됐었는데 프론트랑 연결하는게 어려웠다. 나 혼자하는 프로젝트도 아닐 뿐더러 시간이 부족했기 때문에 블랙리스트를 버리고 배운 내용으로 다시 코드를 작성해야 했다. 때문에 나는 많은 기능을 구현하지 못해다.

그래도 없는 시간 쪼개가면서 console과 log를 하나 하나 찍어가며 실행한 결과 이유를 알아냈다.

• AJAX를 사용하여 헤더에 JWT를 담아 서버에 로그아웃 요청을 보냈다. (getJwtFromCookie는 쿠키에서 JWT를 추출하는 메서드이다.)

    function logout() {
        const jwtToken = getJwtFromCookie();
        console.log(jwtToken)

        // AJAX를 사용하여 서버에 로그아웃 요청을 보냅니다.
        $.ajax({
            type: "POST",
            url: "/api/logout",
            headers: {
                'Authorization': jwtToken,
            },
            success: function (response, textStatus) {
                alert('로그아웃 되었습니다.');
                console.log(textStatus)
                window.location.href = "/";
                deleteJwtCookie();
            },
            error: function (jqXHR, textStatus, errorThrown) {
                // 로그아웃 실패 시 처리
                alert("로그아웃 실패");
            }
        });
        // window.location.href = "/";
        // deleteJwtCookie();
    }

• console에 찍히는 jwtToken은 Bearer%20eyJhbG.. (생략) 이였다.

• 서버로 잘 넘어오는 것도 확인했다.

• 하지만 controller 에서 "Bearer " 공백 이후의 토큰값(ey...)만 log에 나타나야 하는데 실제 찍힌 토큰은 20eyJhbGciOiJI... (생략) 공백을 표시하는 숫자도 표시가 되어 있었다.

• 때문에 토큰 검증에서 잡혀 null 값을 반환해 토큰이 블랙리스트에 저장이 되지 않았던 거였다. 아래 코드에서 substring(7)을 9로 바꿔줬더니 블랙리스트에 잘 저장이 되는걸 확인했다.

    public String resolveToken(HttpServletRequest request) {
        String bearerToken = request.getHeader(AUTHORIZATION_HEADER);
        log.info("bearerToken : " + bearerToken);

        if (StringUtils.hasText(bearerToken)&& bearerToken.startsWith("Bearer")) {
            return bearerToken.substring(7);
        }
        return null;
    }

[최종] 백오피스 S.A

🐰 비록 프로젝트에는 블랙리스트로 구현한 로그아웃이 들어가지 못했지만 이슈의 원인을 알아냈고 잘 로그아웃이 되는 것도 확인이 되어서 기분 좋게 프로젝트를 마무리 할 수 있었다.