로그아웃 기능을 만들어보자!

우선 기존 포스팅 내용을 정리해보자.

1. 회원 가입 기능을 만들어보자! (해시 암호화/복호화) : https://marketerbong.tistory.com/90

2. 회원 로그인 기능을 만들어보자! (쿠키값 생성 및 유지 - ft. JWT 토큰) : https://marketerbong.tistory.com/91

3. 비밀번호 변경 기능을 만들어보자! (ft. JWT 암호화/복호화) : https://marketerbong.tistory.com/92

4. 회원탈퇴 기능을 만들어보자! : https://marketerbong.tistory.com/93

 

처음 접근은 JWT 토큰으로 쿠키값을 생성하고 유지하고 있으니, 이걸 지우면 되겠다! 라는 생각이 들었다.

그래서 "JWT 토큰 로그아웃"이란 키워드로 검색했다.

 

여러 포스팅이 나오는데, 솔직히 개발 지식이 짧아서 그런지 이해하기 어려웠다.

 

그러다 문득 쿠키값을 삭제하는 게 어렵다면, 쿠키값이 만료되도록 해서 (자동으로 로그아웃이 풀리는 현상) 로그아웃 시키면 되지 않을까? 라고 생각했다.

그래서 gpt한테 물어봤다. 계속 물어봤더니, "expires헤더" 라는 키워드를 던져줬다.

그리고 이걸 바탕으로 로그아웃 기능을 구현해달라고 말했더니..

정말 허탈할 정도로 쉬웠다.

 

1. login.py에 아래 logout 라우터 관련 코드 추가

@bp.route('/logout')
def logout():
    # Clear the token cookie by setting it to an empty string and expiration to the past
    response = make_response(redirect(url_for('login.loginCall')))
    response.set_cookie('mytoken', '', expires=0)
    return response

토큰이 가지는 시간을 과거의 값으로 주어, 토큰이 만료되었음을 나타낸다.

즉, 로그아웃이 되는 것이다.

 

2. url_for 함수를 사용해 login.py 에 있는 logout 라우터를 호출

        <div class="user_function">
            <!-- href속성 내 url_for 함수 사용 -->
            <a class="user_btn" href="{{ url_for('login.logout') }}">로그아웃</a>
            
            <a class="user_btn" onclick = "location.href ='/change_pw'">비번 변경하기</a>
            <a class="user_btn" onclick = "location.href ='/member_del'">회원 탈퇴하기</a>
        </div>

부트스트랩을 통해 만든 버튼이기에 여기다 적용해야했다.

url_for을 사용해 올바른 로그아웃 경로에 동적으로 연결했다.

 

처음엔 action 속성과 method GET 요청을 하라고 gpt가 알려줬다.

하지만 내가 원하는 대로 꾸미고 싶어 부트스트랩 a 태그에 url_for 함수를 사용하는 방법을 찾았다.

gpt가 방향을 잡는데는 도움이 되지만 만능은 아님을 다시 한 번 확인했다.