JWT로 로그인하고 쿠키를 이용해서 닉네임 표시하기

JWT토큰으로 회원가입과 로그인을 완성하고

게시판 상단에 로그인한 닉네임과 작성자 닉네임을 표현하고 싶었다.

 

로컬호스트에 접속을 하면 board_list게시판이 나온다

하지만 로그인 정보가 존재하지 않아서 login 페이지로 넘어가고 로그인이 완료되면 게시판으로 이동이 된다.

밑에 코드에서 board_list로 넘어갈때 닉네임 정보를 같이 넘겨준다.

@app.route('/')
def home():
    token_receive = request.cookies.get('mytoken')
    try:
        payload = jwt.decode(token_receive, SECRET_KEY, algorithms=['HS256'])
        user_info = db.user.find_one({"id": payload['id']})
        return render_template('board_list.html', nickname=user_info["nick"])
    except jwt.ExpiredSignatureError:
        return redirect(url_for("login", msg="로그인 시간이 만료되었습니다."))
    except jwt.exceptions.DecodeError:
        return redirect(url_for("login", msg="로그인 정보가 존재하지 않습니다."))

 

쿠키안에 있는 정보를 사용할려면 jquery.cookie.js 가 꼭 필요하다.

{{nickname}} 을 추가해주면 닉네임이 적용된다.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
.
.
.
<div class="mytitle">
  <span class="nick_top">{{nickname}}님 환영합니다.</span>
  <button type="button" style="margin: 5px; float: right" class="btn btn-primary "
          onclick="logout()">로그아웃
  </button>
</div>

 

그리고 다른 페이지를 이동하고 또 닉네임을 쓰고 싶으면 그 페이지에 닉네임을 또 넘겨주어야한다.

@app.route('/board_add')
def board_add():
    token_receive = request.cookies.get('mytoken')
    try:
        payload = jwt.decode(token_receive, SECRET_KEY, algorithms=['HS256'])
        user_info = db.user.find_one({"id": payload['id']})
        return render_template('board_add.html', nickname=user_info["nick"])
    except jwt.ExpiredSignatureError:
        return redirect(url_for("login", msg="로그인 시간이 만료되었습니다."))
    except jwt.exceptions.DecodeError:
        return redirect(url_for("login", msg="로그인 정보가 존재하지 않습니다."))

<div class="mytitle">
  <span class="nick_top">{{nickname}}님 환영합니다.</span>
  <button type="button" style="margin: 5px; float: right" class="btn btn-primary "
          onclick="logout()">로그아웃
  </button>
</div>
<div class="myboard">
  <h1>게시글 작성중</h1>
  <div class="mb-3">
    <label for="title" class="form-label">작성자</label>
    <h1>{{nickname}}</h1>
    <label for="title" class="form-label">제목</label>
    <input type="text" class="form-control" id="title">
  </div>
  <div class="mb-3">
    <label for="comment" class="form-label">내용</label>
    <textarea class="form-control" id="comment" rows="10"></textarea>
  </div>
  <button onclick="comment_save()" type="button" class="btn btn-primary">저장</button>
</div>