[과제] 03주차(3-2) JWT 구현 - jwt 규격에 어긋남

모의 해킹 스터디 - 3주차 과제 (3-2) JWT 구현(로그인 유지) 문제점 발견

 

기존의 로그인 페이지의 Develop 과제

모의 해킹 스터디 - 3주차 과제(1) 로그인 페이지 보완

모의 해킹 스터디 - 과제 03주차(1) 로그인 페이지 보완

• 위의 과제부터 JWT를 사용, 이전에는 세션(SESSION)을 이용
• (기존의 과제 진행에 있어 GET을 이용하여 다른 페이지로 정보를 보내려 했음)
• 보안적인 문제만 발생할 뿐, JWT를 이용하여 전부 구현 가능

---

코드 목록 및 구성

WebApp
│
│ index.php
│ login.php
│ login_func.php
│ regist.php
│ regist.post.php
│ home.php
│ edit_pw.php
│ change.php
│ edit.php
│ update.php
│ withdraw.php
│ delete.php
│
├─ inc
│   ├─ db.php
│   └─ header.php
│  
├─ lib
│   └─ jwt.php
│
└─  css
    └─ style.css

---

JWT 

 

lib/jwt.php

<?php
    class JWT{
        protected $alg;
        protected $secret_key;

        // 생성자
        function __construct(){
            // 사용할 알고리즘
            $this->alg = 'sha256';
            // 비밀 키
            $this->secret_key = "your secret key";
        }
        
        // JWT 발급(hash) - Header . PayLoad . Signature
        function hashing(array $data): string{
            // Header(헤더) - alg (사용할 알고리즘), typ (타입) 명시
            $header = json_encode(array(
                'alg' => $this->alg,
                'typ' => 'JWT'
            ));

            // PayLoad(페이로드) - 전달할 데이터
            $payload = json_encode($data);

            // Signature(서명)
            $signature = hash($this->alg, $header . $payload . $this->secret_key);
            // JSON 형태의 객체를 base64로 인코딩
            return base64_encode($header . '.' . $payload . '.' . $signature);
        }

        // JWT 해석(dehash) - 사용자 검증
        function dehashing($token){
            // 토큰(base64 디코딩) 분할 (구분자 . 기준) - 배열로 저장
            $parted = explode('.', base64_decode($token));
            
            $signature = $parted[2];
            // 토큰 발급시와 같은 방법으로 Signature 생성 후 비교
            if(hash($this->alg, $parted[0] . $parted[1] . $this->secret_key) != $signature){
                return "Signature Error";
            }

            // 만료 검사 - payload 의 exp
            $payload = json_decode($parted[1], true);
            // '토큰 만료 시간'이 '현재 시간'보다 전이면
            if($payload['exp'] < time()) {
                return 'Expired';
            }
           
            /*
            * 기타 토큰 확인 작업
            */

            return json_decode($parted[1], true);
        }
    }
    $jwt = new JWT();
?>

• 위의 표에서 보면, 쿠키를 열어보았을 때, 로그인 전에는 PHPSESSID만 존재하고, 로그인 후에는 token이 생긴 것을 확인할 수 있음
• 토큰 발급 이전에는 헤더가 '로그인/회원가입' 이지만, 토큰이 발생된 후에는 inc/header.php 에서 토큰 존재를 확인하고 '로그아웃' 으로 바뀐 것을 확인할 수 있음

---

• __construct() : 생성자
  • 사용할 알고리즘을 결정 : alg = 'sha256'
  • 사용할 비밀 키를 지정 : secret_key = "your secret key"

---

• JWT 발급
  • hashing(array $data): string 함수를 이용
    • (hash)  Header . PayLoad . Signature 
  • Header(헤더) - alg (사용할 알고리즘), typ (타입) 명시
    • alg 는 생성자에서 받아옴
    • typ은 JWT
  • PayLoad(페이로드) - 전달할 데이터
    • $payload = json_encode($data);
    • $data는 hashing 사용 시에 넣어줌
    • (data를 json 인코딩)
  • Signature(서명)
    • $signature = hash($this->alg, $header . $payload . $this->secret_key);
    • 서명은 헤더, 페이로드를 합치고, 사용 알고리즘을 기반으로 비밀키와 함께 해시 변환
    • JSON 형태의 객체를 base64로 인코딩
      • base64_encode($header . '.' . $payload . '.' . $signature);

---

• JWT 해석
  • dehashing($token) 함수를 이용
    • (dehash) - 사용자 검증
  • 받아온 토큰(base64 디코딩)을 분할하여 (구분자 . 기준)  배열로 저장
    • $parted = explode('.', base64_decode($token));
    • $parted[0] 는 Header
    • $parted[1] 는 Payload
    • $parted[2] 는 Signatue
  • 토큰 발급시와 같은 방법으로 Signature 생성 후 비교
    •  if(hash($this->alg, $parted[0] . $parted[1] . $this->secret_key) != $signature)
  • 페이로드의 만료 검사
    • $payload = json_decode($parted[1], true);
    • '토큰 만료 시간'이 '현재 시간'보다 전이면 파기
      •  if($payload['exp'] < time()) : 
  • 기타 토큰의 내용에 대한 확인이 가능하지만, 이번 구현에는 확인하지 않음
  • json 디코딩을 통해 $data값을 반환
    • json_decode($parted[1], true);
  • JWT 사용 선언
    • $jwt = new JWT();
    • 여기서 선언해 줘야 사용에 문제가 없었음

---

JWT 적용

 

• login_func.php 에서 로그인 조건에 부합하면, 로그인되는 유저의 정보를 기반으로 JWT(JSON Web Token)을 발행

토큰 발급(로그인)

login_func.php

<?php
    require_once("inc/db.php");
    require_once("lib/jwt.php");
    
    $userID = isset($_POST['userID']) ? $_POST['userID'] : null;
    $pass = isset($_POST['pass']) ? $_POST['pass'] : null;

    // 파라미터 체크
    if($userID == null || $pass == null){
        header("Location: /login.php");
        exit();
    }

    // 회원 데이터 조회
    $db_conn = db_connect();
    $sql = "SELECT * FROM userTbl WHERE userID= '$userID'";
    $ret = mysqli_query($db_conn, $sql);
    
    // 회원 데이터가 없다면
    $row = mysqli_fetch_array($ret);
    $cnt = mysqli_num_rows($ret);
    if($row['userID'] == null || $cnt == 0){
        echo '<script>alert("로그인 정보를 찾을 수 없거나 잘못 입력"); history.back(-1)</script>';
        exit();
    }
    
    // 비밀번호 일치 여부 확인
    $is_pw = password_verify($pass, $row['pass']);

    if($is_pw === false){
        echo '<script>alert("로그인 정보를 찾을 수 없거나 잘못 입력"); history.back(-1)</script>';
        exit();
    }
    
    // 로그인 조건 달성(jwt에 들어갈 정보)
    $id = $row['userID'];
    $name = $row['name'];
    // $email = $row['email'];
    // // e-mail 의 경우 . 이 들어가기 때문에, (.)이 들어가도 JWT가 분리되지 않기 위한 base64 인코딩
    // $email = base64_encode($email);
    
    // 유저 정보를 가진 jwt 만들기
    $token = $jwt->hashing(array(
        'exp' => time() + (3600), // 만료 시간
        'iat' => time(), // 발급 시간
        // 유저 정보 (pass 제외)
        'id' => $id,
        'name' => $name,
        // 'email' => $email,
    ));
    // 만료 시간이 token과 동일한 쿠키에 token을 넣어줌(구지 같은 이유 X)
    setcookie("login_token", $token, time() + (3600));

    mysqli_close($db_conn);
    header("Location: /home.php");
?>

 

• JWT를 사용하기 위해 incluing
  • require_once("lib/jwt.php");
• 로그인 과정 자체는 기존과 동일 (식별/인증 분리 with hash)
• 로그인 조건에 부합하는 경우
• jwt에 넣을 사용자 인증을 위해 필요한 정보
  • userID, userName : 식별을 위함
  • pass의 경우 민감정보이기 때문에 넣지 않음
  • 만약 email과 같이 점(.)이 데이터 자체에 들어가는 경우
    • 점(.)에 의해 [헤더] . [페이로드] . [서명] 이외에 분리되지 않도록 해야함
    • base64 인코딩을 이용 점(.)을 없애 줌
    • 없애는 과정에서 등호(=) 가 생기는 경우, (=)는 삭제해줘도 무방
• jwt 발급
  • 만료시간(exp) : time() or now() + (유지할 시간)
  • 발급시간(exp) : time() or now()
• 쿠키(Cookie) 생성
  • 발급된 JWT를 사용하기 위해 쿠키에 넣어 줌

---

토큰 해석(사용자 인증)

home.php

<!DOCTYPE html>
<html lang="ko">
	<head>
	<meta charset="utf-8">
		<title>Home</title>
		<link rel="stylesheet" href="css/style.css">
	</head>
	<body>
	    <div class ="container">
        	<h1 class="spacing grad">Home</h1>
        	<?php require_once("inc/header.php"); ?>
                <?php 
                    require_once("lib/jwt.php");
                    // Cookie 에서 jwt 가져오기
                    $token = $_COOKIE['login_token'];
                    // jwt에서 유저 정보 가져오기
                    $data = $jwt->dehashing($token);
                    echo "안녕하세요, " . $data['name'] . " 님";
                    echo "<br><br>";
                    echo "여기는 홈 페이지 입니다.<br><br>";
                ?>
                <p style='text-align:left'>
                    <a href='/mypage.php'>마이페이지</a>
                    <a href='/edit_pw.php'>비밀번호 변경</a>
                    <a href='/withdraw.php'>회원 탈퇴</a>
                </p>
    	</div>
	</body>
</html>

 

• JWT를 사용하기 위해 including
  • require_once("lib/jwt.php");
• Cookie 에서 jwt 가져오기

 

• 로그인이 되고 나면 위와같이 login_token이 쿠키에 들어있는 것을 확인할 수 있음
• $token = $_COOKIE['login_token']; 을 이용하여 쿠키에서 해당 토큰을 가져옴
• jwt에서 유저 정보 추출
• $data = $jwt->dehashing($token);
  • dehash 된 토큰은 기존에 삽입한 데이터의 배열
  • 필요한 데이터를 $data['name'] 형식으로 불러올 수 있음

---

토큰 파기(로그아웃)

index.php

<?php
	setcookie("login_token", $token, time()-(360*30));
?>
<!DOCTYPE html>
<html>
	<head>
		<title>Index Page</title>
		<link rel="stylesheet" href="css/style.css">
	</head>
	<body>
		<div class="container">
			<h1 class="spacing grad">Index 페이지</h1>
			<?php require_once("inc/header.php"); ?>
			<h2>로그인해주세요.</h2>
			<p>아이디가 없다면 회원가입.</p>
		</div>
	</body>
</html>

 

• 로그아웃 시에 index 창으로 리디렉션되고, 쿠키의 시간을 0이하로 만들어줌으로써 안에 들어있는 토큰을 삭제
  • setcookie("login_token", $token, time()-(360*30));
• 문제점
  • 해당 페이지로 리디렉션 될때 쿠키를 삭제하여 토큰을 지우다 보니
  • inc/header.php 에서 인식하게 하기 위해 한번 새로고침해줘야 '로그아웃' -> '로그인/회원가입 ' 으로 바뀜
  • 페이지를 새로 고치는 행위는 꼼수적 수단 (페이지를 한번 더 로드해야하는 것...)
    • 새로고침의 경우
    • echo("<meta http-equiv='refresh' content='0'>"); 형식으로 가능하지만
    • 한번만 새로고쳐야하는데, 제대로 구현하지 못함

---

아직 미구현인 부분

 

로그인 유지

• refresh_token : 로그인 유지를 위한 Access Token 연장용 Token
  • 체크박스 입력을 통해 로그인 유지를 체크하거나
  • 토큰의 시간을 늘려줘야하는 경우

• jwt 삭제( 쿠키를 만료시켜 구현은 시켰지만, 완벽하게 동작하진 않는 상태 )

---

후기

 

• index.php로 리디렉션 될 때가 아닌, 로그아웃을 눌렀을 때 쿠키를 바로 삭제하고 넘어가야할 것 같지만.
• 아직 버튼 구현 및 사용에 대하여 익숙하지 않아 우선적으로 동작이 되는 것만을 확인
• jwt 발급/ 해석 은 그래도 어느정도 이해가 가고 진행이 되었으나 유지 관리의 문제는 또 다른것임을 깨달음
• 하지만 어떻게 보면 유지 관리가 보안 측면에서는 더 중요한게 아닐까?

 

 

 

 

질문 환영, 수정 및 보완에 대한 지적 환영