Frudy
7k
2021-01-17 18:31:32 작성 2021-01-17 18:33:28 수정됨
22
5039

웹 결제시스템(?)을 구축해달라는 요청이 있어서 찾아봤습니다.



기획자님이 탑툰 웹사이트 결제수단 고르는 화면 예시로 보여주면서

우리 회사가 운영하는 웹사이트 에서도 결제할 수 있게 해달라고 하시면서

결제수단 뭐뭐가능한지 부터 목록을 알려주면 기획하는데 참고하겠다고 했어요.


저는 기존에 관련 경험이 0이어서 처음부터 찾아봤던 내용들을 공유하려고 적어봅니다.

(저는 웹 프론트앤드 개발을 하고있습니다)


1. PG사가 무엇일까?

웹사이트에서 고객의 결제수단으로 결제를 할 수 있도록 도와주는 역할을 PG사가 한다 정도로 이해를 했습니다.

https://ko.wikipedia.org/wiki/%EC%A0%84%EC%9E%90%EC%A7%80%EA%B8%89%EA%B2%B0%EC%A0%9C%EB%8C%80%ED%96%89%EC%84%9C%EB%B9%84%EC%8A%A4


예시로 네이버페이가 PG사에 속하는지 안속하는지까지는 관심이 없지만,

https://developer.pay.naver.com/docs/v2/api

결제수단마다 이런식의 사이트가 존재했습니다.


그래서 제가 탑툰 사이트 처럼 결제수단 (네이버페이 카카오페이 토스 등등)을 여러개 만드려면,

결제수단별로 코드를 작성해야하는것으로 예상이 되었었어요.


위의 수고를 덜어주기위해,

https://www.iamport.kr/feature 라는 서비스를 찾았습니다.


아임포트는 국내외 주요 PG사들과 연동됩니다. 더이상 PG사를 추가할 때마다 연동 가이드를 보면서 씨름할 필요가 없습니다. 아임포트로 여러 PG사들을 즉시 사용하세요.


제가 예상한게 맞더라구요.

네이버페이 카카오페이 토스 등등 하나 추가할 때마다 계속 코드를 작성해야했었나봐요.


그런데 이 사이트가 정말 감사한게,

https://github.com/iamport/iamport-manual

깃허브 페이지에 사용법을 안내하는걸로 안끝납니다


보통 라이브러리 깃허브 보면 API Reference있고 Example Motivation같은것 있고 끝이거든요.

그런데 저기는,


https://github.com/iamport/iamport-manual/blob/master/%EC%9D%B8%EC%A6%9D%EA%B2%B0%EC%A0%9C/background.md


"결제" 자체에 대해서도 알려줍니다. 결제 프로세스부터 결제의 종류 등등이요.

결제 프로세스같은것들은 저같은 사람한테 생소하거든요. PG라는 단어가 무슨뜻인지도 오늘 처음알았어요.


3. 그래서 지원하는 PG사 종류는?

"하나의 라이브러리로 여러곳의 PG사를 등록할 수 있다" 라고 했으니,

이 라이브러리로 얼마나 많은 PG사를 이용할 수 있는지가 궁금했었어요.

https://www.iamport.kr/pg


음 제가 평소에 다른사이트에서 보던것들은 다 있더라구요.


4. 그래서 어떻게 구현해야할까?

https://okky.kr/article/438760


총 5가지 정도로 생각을 정리했어요.


(1) 개발 / 구현 / 테스트

PG사와 계약을 하지않더라도,

테스트는 가능하다고 합니다. 아임포트에서도 테스트는 가능하다고 명시가 되어있더라구요.

그래서 개발하는건 아임포트 깃허브 보면서 구현을 하면 문제없이 완성할 수 있다고 판단됬어요.

라이브러리 설명서 보며 구현하는건 익숙해서 걱정이없어요.


(2) PG사와 계약준비

아임포트는 여러 PG사를 하나의 라이브러리로 구현할 수 있도록 도와주는 역할만 합니다.

그래서 실제 PG사와의 계약은 직접 해야한다고 하네요.

그래서 PG사와 계약하는데 사업자등록증부터 실제 판매하는 상품종류까지

PG사마다 뭐 이런저런 조건이 붙는거같아요.


그중에서 개발자로써 PG사 계약 준비를 해줘야하는것들이 좀 있더라구요.


개인정보 수집한다고 어딘가에 명시를 해줘야하는거같고,

결제할때도 약관같은거를 어딘가에 명시해줘야하는거같고,

뭐 이런것들이요. 이건 제가 해야하는일이니까요. 


근데 또 PG사마다 요구하는게 다를 수 있으니

이부분은 PG사 계약하기전에 찾아보면 될거같아요.

그리고 PG사에서 이거 안해주면 계약 안해줄거라고 피드백 주겟죠, 이부분은 별로 걱정이 없습니다.


(3) PG사와 계약

PG사마다 계약을 다 직접 맺어야하는데 이걸 저한테 시킬지 말지 모르겠어요.

회사가 스타트업이라 각 분야별로 인원이 나뉘어진게 아니여서요.


(4) 아임포트 서비스신청

아임포트가 어쨌든 PG사마다 구현하는 작업을 도와주는 서비스이기때문에,

여기도 돈받고 하더라구요.

그래서 회사이름으로 계정만들고, 돈 10만원 (최초 1회)내서 신청하면 되겠더라구요.


(5) 프론트앤드 개발 소요

https://github.com/iamport/iamport-manual/blob/master/%EC%9D%B8%EC%A6%9D%EA%B2%B0%EC%A0%9C/background.md

결제 프로세스 알려주는곳을 다 읽어보고 현재 예상하고있는 절차는,


저는 사용자가 결제 요청을 하도록 돕고,

그걸로 결제되고 사용자 통장에서 돈이 빠지는 프로세스 까지는


회사의 백엔드 개발자가 1도 참여하는게 없다는거에요.

당연히 결제요청에 대한 응답은 우리 회사서버에서 하는게 아니니까요.

그래서 결제 요청을 만들어서 보내고 성공했을 때 / 실패했을 때 까지가 제 역할인거같아요.


대신에 결제가 성공했을 때 어느사용자가 뭐 결제했는지 이런 정보를 회사 서버에 보내주기만하면

이후에는 제가아니라 회사 백엔드개발자가 신경쓸 영역이다 정도로 이해했어요.



이제 정리하면,

1. 기획자분 한테는 아임포트가 지원하는 PG사 종류 보여주면서 이런 결제수단을 등록할 수 있다고 알려주고,

2. 아임포트 회사계정 만드는거랑 비용문제도 담당자에게 알려주고,


저는 아임포트 사용법 익히고 저기서 알려주는 "결제" 관련 배경지식도 같이 익히면,

결과적으로 웹 결제시스템 구축하는데 문제가 없지않을까 하고 생각해봅니다.


그리고 결제 시스템있는 웹사이트는 많잖아요?

이런 시스템을 직접 붙여보는 경험을 한다니 기대가 되네요.

29
39
  • 댓글 22

  • Ormus
    1k
    2021-01-17 18:38:38

    감사합니다

  • Frudy
    7k
    2021-01-17 18:40:31

    음 이부분은 저두 첫경험이라 글에 잘못된 내용이 있을 수 있어요.

    어쨌든 감사하다고 하시니 저두 글 읽어주셔서 감사합니다.

  • chobab
    50
    2021-01-17 20:06:49

    친절한 설명을 해주셧서 감사합니다 ^^

  • 돌덩이
    143
    2021-01-17 20:33:13

    필요한 정보였는데 공유해주셔서 감사합니다!

  • 준호
    637
    2021-01-17 22:35:09

    PG사 호출의 경우 프론트앤드의 업무보다는 결제 단계별 데이터 검증 및 이력, 결제 성공 시 해당 결제 성공 데이터 검증, 결제 취소 프로세스, 위변조 방지, 중복 결제 방지 프로세스, 정산데이터 검증 등 백엔드의 업무가 대다수입니다.


    프론트앤드의 업무는 각 PG사에서 배포한 라이브러리 호출이라고 보시면 되고 일반적으로 결제 성공시 사용자 브라우저에서 결제 성공 URL에 결제 성공 검증 시 사용할 데이터를 암호화해서 호출하고 그 콜백을 기준으로 결제 성공 여부 및 결제 금액 일치를 검증하고 성공 시 결제 성공 데이터를 적재합니다.

  • Frudy
    7k
    2021-01-18 02:24:31

    알려주셔서감사합니다~


    결제 단계별 데이터 검증 및 이력, 결제 성공 시 해당 결제 성공 데이터 검증

    이부분은 이해가안되요.


    네이버페이를 예로든다면

    카드선택후 본인인증하고 돈빠지는것까지 사이사이 결제단계는


    전부 네이버페이 그 쪼만한 팝업창에서 이루어지는데,

    결제 단계벌 데이터 검증이 어떤뜻인가요?


    그리고 결제성공시 데이터를 검증해야하는 이유는 어떻게되나요? 안하면 무슨일이발생할수있나요?


    답변해주시면 감사합니다!

  • 잡초
    1k
    2021-01-18 10:20:11

    제가 알기론 아임포트도 결제 시 수수료 조금 받아 갑니다.


  • youngyoung
    2k
    2021-01-18 10:51:37

    결재성공시 데이터 검증안하면 유저의 결제금액과 실제 결제된 금액이 차분이 발생했을경우나 

    위조결제시 올바르게 요청한 유저의 결제된것인것에 대한 확인이 안됩니다

    그리고 요즘엔 드물지만 PG에서의 중복결제에 대한 체크들도 있고요(해외결제의 경우 이중으로 생기는 경우 가끔 있었습니다)

    그리고 신용카드결제는 프로세스 조금 다릅니다.

    가끔보이는 스미싱 사기도 이런걸로 생기죠

  • Frudy
    7k
    2021-01-18 12:33:26

    답변감사합니다.

  • 준호
    637
    2021-01-18 15:24:32

    결제 프로세스가 결제 하나로 끝나는 게 아니기때문에 그렇습니다.


    상품 선택  -> 장바구니 -> 결제 -> 결제 성공 일반적으로 이 프로세스로 구성되어 있고 해당 프로세스마다 해당 단계에 맞는 데이터인지 결제하려는 상품 데이터의 유효성 검증등 결제 프로세스에서 PG사 호출 말고 백엔드에서 처리해야 하는 프로세스가 굉장히 많습니다.


    물론 해당 사항은 프론트앤드에서 신경 쓸 문제는 아니고 백엔드에서 설계해야 할 부분입니다.

  • Frudy
    7k
    2021-01-18 18:09:20

    아~

    PG사 호출 이전에


    1. 장바구니에 잘 들어갔는지 확인하고

    2. PG사 호출하기직전에 결제금액이 장바구니 목록 총합 + 수수료 세금 쿠폰 등등이랑 맞는지 확인하고


    뭐 이런거 말씀하시나봐요.

    제가 잘 이해했는지 모르겠네요 ;


    근데 아직은 잘 납득안되는구석이 있네요...

    이부분은 좀더 고민해보겠습니다.

  • 준호
    637
    2021-01-18 21:43:53

    프론트앤드는 항상 위변조의 가능성이 있기때문에 결제같은 프로세스는 거의 모든 프로세스가 백엔드에서 진행된다고 보셔야 됩니다.


    결제를 단순히 결제 금액을 URL에 담아서 요청하고 승인이 나면 끝나는 프로세스로 이해하시면 굉장히 위험합니다.


    PG사 메뉴얼은 위 내용처럼 결제 요청, 결제 요청에 대한 승인 프로세스만 메뉴얼로 정리되어 있는데 실제 업무를 분석해보시면 결제에 관련된 모든 업무에서 결제 요청, 승인은 굉장히 일부분이라는 걸 염두에 두고 업무를 파악하셔야 합니다.

  • Frudy
    7k
    2021-01-18 22:06:28

    넵 알려주셔서 감사합니다

  • 체블러
    179
    2021-01-19 09:58:50

    포트폴리오용으로 쇼핑몰 프로젝트 만들었었는데 결제를 뭘로할지 하다가 저도 전에 아임포트 알게되서

    카카오페이 선택해서 만들었는데


    실제로 폰으로 메세지오고 결제까지 테스트 되니까 좋더라구요

    ajax사용해서 하니까 그것도 편했고


    그리고 문서가 자세해서 생각보다 쉽게 구현했어요

  • 열공하자
    1k
    2021-01-19 10:50:54

    아임포트는 써보지 않아서 모르겠지만

    결제 프로세스 태울때 원하는 파라미터를 다 받아올 수 있는지도 체크를 해봐야 할듯하네요.

  • 보후리
    557
    2021-01-19 11:10:10
    이거 좀 조흔 정보네요.. 감사합니다 정보공유 ㅎㅎ 전 초보자에요 
  • Frudy
    7k
    2021-01-19 12:06:46

    결제 프로세스 태울때 원하는 파라미터

    ㅡㅡ


    이부분혹시 추가답펀해주실수있나요?

    어떤말씀이신지 모르겠어요.

    예시하나만 들어주실수있을까요?

  • 열공하자
    1k
    2021-01-19 12:19:18

    Frudy 

    저는 PG사 개별로 붙여서 결제쪽을 했었습니다.

    결제 요청시 프로세스 태우고 결제 과정을 DB에 적재시에 필요한 파라미터들을 말하는건데

    기본적인것은 제공해 줄것으로 판단됩니다만 더 디테일하게 쌓을때 필요한 값들을 얼마나 제공해줄까가

    궁금해서 댓글 작성했습니다. 예를 들면 결제 오류 콜백시 오류코드가 보통 실패로 날아올텐데 해당 오류를

    디테일한 코드로 구분해서 내려줄 수 있는지 여부 등이 있겠죠.

    500에러가 아닌 자체적으로 구분하는 오류 등(EX : 영업시간아님(0100) , 계좌잔액부족(0200) )

    등의 형태입니다.

  • Frudy
    7k
    2021-01-20 12:13:16

    답변감사합니다~

  • 소소희
    8
    2021-01-20 21:11:06
    현직 기획자입니다. 오키 보면서 처음으로 로그인했네요. 
    윗분들의 댓글처럼 결제쪽은 각 단계별 검증 요소가 많습니다. 결제에서 프로세스가 종료되는것이 아니라 환불, 취소, 반품, 교환 등의 클레임 처리 부분에 대한 프로세스가 결제수단별로 다르며 발생되는 케이스가 많습니다. 클레임별 프론트엔드 처리도 필요하고요. 또한 PG 및 결제수단 별 정산주기도 다르기에 프론트엔드에서 시스템 적용이 가능하다는 검토만으로 도입하기엔 리스크가 큽니다.
  • Frudy
    7k
    2021-01-20 21:39:02

    네 감사합니다.

  • 얀코프
    138
    2021-01-24 01:00:58

    너무 좋네요


    상세한 설명 감사합니다!

  • 로그인을 하시면 댓글을 등록할 수 있습니다.