[JWT} [WEB] JWT(Json Web Token)란? 개념 정리 및 예제

Json Web Token

  • JWT(Json Web Token)은API 인증에 필요한 정보들을 암호화시킨 토큰입니다.
  • JWT인증 기반은 JWT 토큰을 Http헤더에 담아 서버가 클라이언트를 식별하게 되는 방식입니다.
  • JWT에 대해 확인 하고자 할 경우 JWT의 사이트를 통해 참고하시면 됩니다.
  • 토큰을 기반으로 하는 인증 시스템은 세션을 사용하는 서버 기반과 다르게 클라이언트가 서버에 접속을 하면 서버에서 해당 클라이언트에게 인증되었다는 의미로 토큰을 지급하게 됩니다.
  • 지급받게 된 토큰으로 클라이언트가 보낼 요청을 토큰 헤더에 저장되어 다시 서버에 요청을 보낼 수 있습니다.

JWT 토큰

 . 을 기준으로 구분되며 총 세 부분(HeaderPayloadSignature)으로 나눠져 있습니다.

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9. ← // 헤더 (Header)
eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ. ← // 내용 (Payload)
SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c // 서명 (Signature)

 

 

 


Header

{
  "alg": "HS256", // alg에선 해싱 알고리즘을 지정합니다. (HMAC SHA256, RSA이 사용됩니다.)
  "typ": "JWT" // typ은 타입을 지정합니다.
}

  Header는 JWT 토큰을 어떤 방식으로 확인되는지 명시한 부분으로 헤더를 확인하고 추가로 확인될 Payload , Signature를 알아볼 수 있습니다.  위에 코드처럼 헤더가 지정되어 있다면 base64Url 인코딩 되어 헤더가 생성됩니다.

Payload

{
  "sub": "1234567890",
  "name": "John Doe",
  "admin": true,
  "iat": 1516239022
}

  Payload는 토큰의 두 번째 부분을 담당합니다. 해당 부분에는 등록, 공개 및 비공개 클레임의 세 가지 유형으로 나뉩니다.  등록된 클레임은 필수는 아니지만 유용하고 상호 운용 가능한 클레임 집합을 제공하기 위해 권장되는 정의된 클레임 집합입니다. 그중 일부는 아래와 같습니다.

  • Registered claims :  등록된 클레임
    • iss(발급자)
    • exp(만료시간)
    • sub(제목)
    • aud(대상)
    • 그외 기타

 

  • Public claims : 공개된 클레임
    JWT를 사용하는 사람들이 원하는 대로 정의할 수 있습니다. 다만 충돌이 발생할 수 있어 충돌 방지 네임스페이스를 포함하는 URI로 정의해야 합니다.
     
  • Private claims :  비공개 클레임
    사용에 동의하고 등록된 클레임 이나 공개된 클레임이 아닌 당사자 간에 정보를 공유하기 위해 생성된 맞춤형 클레임입니다.

 

Signature

HMACSHA384(
  base64UrlEncode(header) + "." +
  base64UrlEncode(payload),
secret)

  서명 부분을 생성하려면 인코딩 된 헤더, 인코딩된 페이로드, 비밀, 헤더에 지정된 알고리즘을 가져와 서명해야 합니다. 예를 들어 HMAC SHA256 알고리즘을 사용하려는 경우 서명은 위의 코드와 같은 방식으로 생성됩니다.

서명은 메시지가 도중에 변경되지 않았는지 확인하는 곳에 사용되며 개인 키로 서명된 토큰인 경우 JWT의 보낸 사람이 누구인지 확인할 수도 있습니다.

 

위와 같은 Header , Payload , Signature 합쳐보면 

 

Encoded

 

이러한 형식의 암호화된 JWT가 보여지게 됩니다. 이러한 개념을 적용하려면 위에 적힌 사이트를 접속하여 디코딩, 확인 및 생성을 할 수 있습니다.

 

 

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

 

  안드로이드에서 시작될 JWT 발행입니다.  아래 import는 토큰을 사용하기 위한 준비 단계라 보면 됩니다.

일단 토큰 처리를 하기 위해 xml파일에 버튼을 하나를 만들고 보여주기 위해 TextView도 만들도록 하겠습니다.

MainActivity.java

//(토큰) 토큰 사용을 위한 준비
import io.jsonwebtoken.JwtBuilder;
import io.jsonwebtoken.Jwts;
import io.jsonwebtoken.SignatureAlgorithm;
import io.jsonwebtoken.security.Keys;
import java.security.Key;
import java.util.Date;

 

 

activity_main.xml

 

 

  <Button
            android:id="@+id/button2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="토큰 처리" />
<TextView
            android:id="@+id/result"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="결과값" />

 

다시 MainActivity.java로 돌아와서

   @Override
    protected void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main); // 실행시 시작하게될 메인 액티비티.
        
        //텍스트 뷰 토큰을 표기하기 위한 객체 생성
        TextView textView = (TextView)findViewById(R.id.result);
        
        Button buttonBack2 = findViewById(R.id.button2); // R.id에서 button2라는 이름에 버튼을 찾는다.
        buttonBack2.setOnClickListener(new View.OnClickListener(){
        
        	// 토큰을 생성하기 위해 진행하며 Header 부분을 시작한다.
            Key key = Keys.secretKeyFor(SignatureAlgorithm.HS256); // 서명 암호화 알고리즘(ex: HMAC SHA256, RSA)
        	
            // 토큰의 만료기간을 설정하기 위해 Date객체를 처리한다.
            long curTime = System.currentTimeMillis();
            Date date = new Date(curTime);
            //test 토큰발행
            String jws = Jwts.builder().
                   setHeaderParam("typ", "JWT"). // 토큰 유형
                   setIssuer("young"). // 발행자
                   setSubject("test@test.com"). // 제목
                   setAudience("nick name").// 토큰을 사용할 수신자
                   setExpiration(new Date(curTime + 3600)). // 만료 시간 , 해당 내용처럼도 할수 있지만 if문으로 조건걸어 처리도 가능.
                   setIssuedAt(new Date(curTime)).// 발급 시간(발행 시간)
                   signWith(key).compact(); // 생성
                   
            // 토큰을 저장한다.
            SharedPreferences pref = getSharedPreferences("pref", MODE_PRIVATE);
            SharedPreferences.Editor editor = pref.edit();
            editor.putString("token", jws);
            editor.commit();
            
            // 토큰 불러오기
            String token = pref.getString("token", "");
            textView.setText(token);
        });
        
    }

해당 과정을 모두 진행했다면 Alt + Shift + F10을 눌러 아래 화면에 app에 Run을 실행하시면 됩니다.

 

 

처리가 되었는지 확인해보면 아래 이미지 내용처럼 토큰이 발급된 것을 보실 수 있습니다.

 

 

 

[출처] https://workerst.tistory.com/96

본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
번호 제목 글쓴이 날짜 조회 수
525 REST API 이해와 설계 #2 API 설계 가이드 졸리운_곰 2018.01.21 68638
524 [Blazor][WASM] Awesome Blazor file 졸리운_곰 2021.08.15 16021
523 JQUERY 로 트리메뉴(TREEVIEW) 만들기 file 졸리운_곰 2019.02.08 3428
522 [JAVASCRIPT에서 session 값 가져다 쓰는 법] 가져오는 법, string data type과 비교하는 법 졸리운_곰 2021.05.14 2123
521 html element text value html에선 .text 가 아니라 textContent 다 졸리운_곰 2019.01.03 1975
520 [button] CSS - Button - 버튼스타일 (버튼크기, 버튼색깔, 버튼비활성화, 버튼그룹, 이미지위버튼) 졸리운_곰 2020.08.26 1657
519 웹기획 탄탄한 홈페이지 설계방법 (스토리보드 다운로드) file 졸리운_곰 2017.10.10 1427
518 JavaScript 및 CCS 코드 은닉 (php의 경우) 가을의 곰을... 2012.11.12 1359
517 JQuery Ajax로 Json사용 가을의 곰을... 2013.01.30 1270
516 [웹어셈블리] Visual Studio 2019와 Emscripten (emcc) 개발 file 졸리운_곰 2020.10.18 1251
515 [wordpress] WPForms 워드프레스 폼빌더 사용법 file 졸리운_곰 2021.04.25 1246
514 템플릿 엔진을 벗어나고 싶은 이유, React 와 Angular 2 사이의 갈등 중간 정리 졸리운_곰 2017.09.26 1176
513 From Unity to Three.js file 졸리운_곰 2017.08.16 1077
512 jQuery에서 JSON 사용하기 (JSON to Object, Object to JSON) 가을의 곰을... 2013.01.30 1035
511 [웹 기획] 화면 설계 용어 - 와이어프레임, 스토리보드, 프로토타입의 차이점 file 졸리운_곰 2017.10.10 956
510 JSON : Javascript Object Notation 간단 설명 file 가을의 곰을... 2013.01.30 955
509 자바스크립트 문자열 비교 예제; 대소 문자 구분/구분 없이 졸리운_곰 2017.07.22 852
508 JSON(JavaScript Object Notation)사용법에 대해 가을의 곰을... 2013.01.30 786
507 2014년 제1회 웹디자인 기능사 필기 기출문제 file 졸리운_곰 2014.01.26 773
506 HTML/CSS기초_drop down 메뉴 만들기 file 졸리운_곰 2019.12.21 761
대표 김성준 주소 : 경기 용인 분당수지 U타워 등록번호 : 142-07-27414
통신판매업 신고 : 제2012-용인수지-0185호 출판업 신고 : 수지구청 제 123호 개인정보보호최고책임자 : 김성준 sjkim70@stechstar.com
대표전화 : 010-4589-2193 [fax] 02-6280-1294 COPYRIGHT(C) stechstar.com ALL RIGHTS RESERVED