2021.02.17

2회차

오늘 공부한 내용

• BodyParser
• JWT
• paypal api

가지고 있는 데이터를 내가 원하는 형태의 데이터로 ‘가공'하는 과정을 parsing 이라 하며 그 과정을 수행하는 모듈 혹은 메소드를 parser 라 일컫는다.

BodyParser

: HTTP post put 요청시 request body 에 들어오는 데이터값을 읽을 수 있는 구문으로 파싱함과 동시에 req.body 로 입력해주어 응답 과정에서 요청에 body 프로퍼티를 새로이 쓸 수 있게 해주는 미들웨어

express 문서에 따르면 미들웨어 없이req.body 에 접근하는 경우에는 기본으로undefined 가 설정되어 있으므로 bodyParser, multer와 같은 미들웨어를 사용하여 요청 데이터 값에 접근해야 한다는 안내를 찾을 수 있다.

클라이언트 측에서 API post 와 put 메소드로 요청시 (get delete 는 불가하다.)

HTTP - MDN 공식 문서

body 를 포함하여 보낼 수 있는데 이 값을 서버 측에서 받는다고 그대로 사용할 수 있는 것이 아니고 서버 내에서 해석 가능한 형태로 변형해야 사용할 수 있게 되는 것이다.

이때

API 요청에서 받은 body 값을 파싱하는 역할을 수행하는 것이 bodyParser 라는 미들웨어이다.

JWT

: JSON Web Token (JWT) 는 웹표준(RFC 7519)으로서 두 개체에서 JSON 포맷을 사용하여 가볍고 수용적인 자가수용(self-contained) 방식으로 정보를 안전하게 전달한다. 주로 회원 인증과 두 개체 사이에서 정보 전달을 할때 사용 된다.

구조

:

헤더 (Header)

Header는 typ와 alg 두가지로 구성 되어 있다.

• typ : 토큰의 타입을 지정 (JWT)
• alg : 해싱 알고리즘을 지정, HAMAC SHA256 , RSA 을 사용한다. 이 알고리즘은 토큰을 검증 할 때 사용되는 signature 부분에 사용.

{
  "alg": "HS256",
  "typ": "JWT"
}

내용 (Payload)

Payload는 토큰에 담을 정보가 들어 있습니다. 여기에 담는 정보의 한 조각을 'claim' 이라고 부르고, 이는 Key / Value의 한 쌍으로 이루어져 있다. 토큰에는 여러 클레임들을 넣을 수 있다.

Claim의 분류는 총 세가지로 이루어져 있다.

• 등록된 (registered) 클레임
• 공개 (public) 클레임
• 비공개 (private) 클레임

1. 등록된 클레임 (Registered Claim)

   등록된 클레임은 토큰에 대한 정보를 담기위한 미리 정의된 클레임의 집합이다. 등록된 클레임의 사용은 선택적으로 사용 가능하지만 사용하는 것을 권장한다.

   • iss : 토큰 발급자 (issure)
   • sub : 토큰 제목 (subject)
   • aud : 토큰 대상자 (audience)
   • exp : 토큰 만료시간 (expiration), 시간은 NumericDate ( ex :1480849147370 ) 형식이어야 하며 언제나 현재 시간 이후여야 한다.
   • nbf : Not Before 를 의미 하며, 토큰 활성 날짜와 비슷한 개념이다. NumericDate 형식이어야 하며, 이 날짜기 지나기 전까지는 토큰을 처리하지 않는다.
   • iat : 토큰이 발급된 시간 (issued at), 이 값을 사용하여 토큰의 age가 얼마나 되었는지 판단 할 수 있다.
   • jti : JWT 의 고유 식별자로서, 주로 중복적인 처리를 방지하기 위하여 사용 된다. 일회용 토큰에 사용하면 유용하다.

2. 공개 클레임 (Public Claim)

   공개 클레임은 사용자 정의 클레임으로. 공개용 정보 전달을 위해 사용된다. 충돌 방지를 위해 URI 포맷을 이용해야 한다.

   {
       "https://tandohak.co.kr/is_authenticated": true
   }

3. 비공개 클레임 (Private Claim)

   비공개 클레임은 등록된 클레임도 아니고, 공개 클레임도 아닌 당사자간에 정보를 공유하기 위해 만들어진 사용자지정 클레임이다. 공개 클레임과 달리 이름이 중복되어 충돌이 될 수 있으니 유의 해야 한다.

   {
       "username": "tandohak"
   }

페이로드의 예제

{
    "iss": "tandohak.co.kr", // 등록된 클레임
    "exp": "1485270000000", // 등록된 클레임
    "https://tandohak.co.kr/is_authenticated": true, // 공개 클레임
    "username": "tandohak" // 비공개 클레임
}

서명 (Signature)

서명은 토큰을 인코딩하거나 유효성 검증을 할 때 사용하는 고유한 암호화 코드이다. 서명은 위에서 만든 헤더와 페이로드의 값을 각각 BASE64로 인코딩 하고, 인코딩 한 값을 비밀 키를 이용하여 헤더에서 정한 알고리즘으로 해싱을 하고, 이 값을 다시 BASE64로 인코딩 하여 생성한다.

⇒ 인증방법으로 왜 jwt를 사용하는지 공부

프론트에서 안전하게 로그인 처리하기(velog)

JWT 는 Json Web Token 의 약자이며 authentication header 내에서 사용되는 토큰 포맷이다.

이 토큰은 두 개의 시스템끼리 안전한 방법으로 통신할 수 있도록 설계를 도와준다.

편의상 JWT 를 Bearer token 으로 부르기로 한다.

Bearer token 의 구성 요소는 header, payload, signature 이다.

• header: 토큰 타입과 암호화 방법을 보관하는 토큰의 한 부분으로 base-64 로 인코딩 된다.
• payload: 유저 정보, 상품 정보 등 다양한 종류의 정보를 저장할 수 있고, base-64 로 인코딩 된다.
• signature: header, payload, secret key 의 조합이다. secret key 는 서버에서 안전하게 보관되어야 한다.

JWT 의 장점은 계정 서버와 API 서버가 분리되어 있을 때 API 서버가 계정 서버로 토큰의 유효성 여부를 쿼리하지 않고

스스로 판단할 수 있다는 것이다.

[출처] bearer 토큰|작성자 니니

Paypal

• live(라이브 버전 - 실제 사용)

• sandbox(샌드박스 버전 - 테스트 용)

• 개발 / 연동 / 테스트 할 경우 샌드박스 계정을 생성해서 사용해야 한다.
  - 페이팔 한국 사이트에서 비지니스 계정으로 회원가입
  - 페이팔 개발자 사이트에서 로그인

• sandbox버튼을 클릭한 상태로 Create app 버튼 클릭 App Name 설정 샌드박스 비지니스 계정을 선택

• App을 생성하면 Client Id 생성된다.
  

paypal checkout button 커스텀 - 페이팔 공식 문서

window.paypal.Button.render(
        {
            env: 'sandbox', //sandbox or live 선택
            client: {
                sandbox: clientId,//App 생성시 생긴 ID 입력(sandbox_client_id)
                production: '',//실제 제품 출시할 경우 입력(production_client_id)
            },
            locale: 'en_US',//한국어 표시 - ko_KR 입력
            style: {
              	//버튼 스타일 지정
                size: 'responsive',//small, medium, large, responsive(공식문서 권장) - 너비에 따라 동적으로 결정
                color: 'gold',//공식문서 추천 순 gold>blue>silver,white>black
                shape: 'pill',//pill(알약모양) - 권장, rect(기본 버튼 모양)
            },
            commit: true,//지금 지불 활성화
            payment(data, actions) {
                return actions.payment.create({
                    transactions: [
                        {
                            amount: {
                                total: 1.00,
                                currency: 'USD',
                            },
                        },
                    ],
                });
            },
            onAuthorize: function (data, actions) {
    // Optional: display a confirmation page here

    return actions.payment.execute()
      .then(function () {
        // Show a success page to the buyer
      });
    }
}, '#paypal-button');

• 페이팔을 테스트 할 경우 sandbox Accounts에 있는 personal.example.com이메일로 로그인 해 결제를 시도해 본다.
• 결제후 business.example.com, personal.example.com 각각 계정의 설정 화면에서 Funding 탭 PayPal - Balance의 USD금액이 변경된 것을 확인한다.

느낀점

• 페이팔 api 사용법 너무 어려웠다 - 사용법 찾는데 시간이 너무 오래 걸렸다.
• 다음에는 네이버 페이, 카카오 페이, 페이코 api 연습!!
• HTTP, 네트워크 공부하기