[개발 가이드] 아트온톡: PortOne 결제 시스템 연동 및 PG 설정 완벽 가이드

안녕하세요, 아트온톡 개발팀입니다. 오늘은 우리 플랫폼의 핵심 기능인 '수강 신청 및 결제'를 위해 한국에서 가장 많이 사용되는 결제 통합 솔루션인 PortOne(포트원)을 연동하는 구체적인 방법을 알아보겠습니다.

신용카드와 카카오페이 버튼을 클릭했을 때 실제 결제가 이루어지기 위해 관리자가 준비해야 할 5가지 단계를 정리했습니다.

---

1. PortOne 회원가입 및 관리자 콘솔 접속

먼저 포트원 관리자 콘솔에 접속하여 계정을 생성합니다. 포트원은 여러 결제 대행사(PG)를 하나의 API로 연결해주는 고마운 서비스입니다.

 👉👉👉포트원 관리자 콘솔👈👈👈

• 준비물: 사업자 등록증 (테스트 모드일 경우 생략 가능), 정산받을 계좌 정보.

포트온 가입하기

2. 가맹점 식별코드(IMP Code) 확인하기

로그인 후, 결제 구현에 가장 중요한 '내 식별 정보'를 확보해야 합니다.

1. 좌측 메뉴의 [결제 연동] -> [내 식별 정보]로 이동합니다.
2. 가맹점 식별코드 (IMP ID): impXXXXXXXX 형태의 코드를 복사합니다. 이 코드는 우리 앱의 IMP.init('impXXXXXXXX') 부분에 들어갑니다.
3. REST API 키 & Secret: 나중에 서버에서 결제 검증을 할 때 필요하므로 안전하게 보관하세요.

3. PG사(결제 대행사) 설정: 신용카드 & 카카오페이

이제 우리 앱에서 사용할 결제 수단을 활성화해야 합니다.

• 신용카드 (KG 이니시스 등):

• [결제 연동] -> [결제 채널] 메뉴 클릭.

• 채널 추가 버튼 클릭 후 PG사 선택 (예: KG이니시스).
• 테스트 모드를 'On'으로 설정하면 실제 돈이 나가지 않는 테스트 환경이 구축됩니다.

• 카카오페이:

  1. 동일하게 채널 추가에서 카카오페이를 선택합니다.

  2. 카카오페이는 별도의 가맹점 계약 없이도 '카카오페이 테스트 가맹점'으로 즉시 테스트가 가능합니다.

4. 코드에 'PG 파라미터' 매칭하기

우리 앱의 requestPayment 함수에서 각 버튼에 맞는 pg 값을 지정해주어야 합니다.

• 신용카드:pg: "html5_inicis" (이니시스 웹표준 결제 사용 시)
• 카카오페이:pg: "kakaopay.TC0ONETIME" (테스트 모드 상점 아이디)

codeTypeScript

// 예시: 버튼 선택에 따른 PG 설정
constdata = {
 pg: paymentMethod === 'kakaopay' ? 'kakaopay.TC0ONETIME' : 'html5_inicis',
 pay_method: paymentMethod === 'kakaopay' ? 'kakaopay' : 'card',
 // ... 나머지 데이터
};

5. 실무 적용 시 주의사항: 웹훅(Webhook)과 검증

결제창이 닫혔다고 해서 결제가 완료된 것은 아닙니다! 보안을 위해 다음 작업이 추가로 필요합니다.

1. 결제 검증: 사용자가 결제 금액을 임의로 수정하여 결제할 수 없도록, 결제 후 서버 측에서 포트원 API를 통해 실제 결제 금액이 일치하는지 확인해야 합니다.
2. 웹훅 설정: 네트워크 오류로 브라우저 창이 닫혀도 서버가 결제 완료 통보를 받을 수 있도록 포트원 관리자에서 'Webhook URL'을 설정해두는 것이 좋습니다.

---

요약: 결제 버튼 구현을 위해 필요한 것

구분	필요한 항목	확인 경로
공통	가맹점 식별코드 (IMP ID)	관리자 콘솔 > 내 식별 정보
신용카드	PG사 채널 활성화 (이니시스 등)	관리자 콘솔 > 결제 채널 추가
카카오페이	카카오페이 전용 CID (테스트용 제공됨)	관리자 콘솔 > 결제 채널 추가

이 포스팅은 쿠팡 파트너스 활동으로, 블로그제작에 도움을 제공합니다.

이제 관리자 설정이 완료되었다면, 아트온톡의 드로잉 워크숍 수강생들이 편안하게 결제할 수 있는 환경이 준비된 것입니다!

---

전문가 팁: 실제 운영으로 전환할 때는 각 카드사/카카오페이와 계약 심사 기간이 1~2주 소요되므로, 오픈 전 미리 심사를 신청하는 것이 좋습니다.

---

이 블로그 글은 관리자가 결제 시스템의 흐름을 이해하고, 개발자와 소통하거나 직접 설정하는 데 큰 도움이 될 것입니다.