아이엠포트를 사용한 결제 구현하기

안녕하세요, 오랜만에 다시 인사드리는 욘듀입니다!

이번 포스트에서는 아이엠포트를 사용한 결제 구현을 진행해보려고 합니다 'v')

실제로 결제를 해볼 수 있는 '테스트' 버젼을 체험해볼 예정입니다!

 

 

아임포트(I'mport;)는 개발자를 위한 무료 결제 연동 서비스인데요

신용카드, 계좌이체, 휴대폰 소액결제, 카카오 페이 등 다양한 결제 서비스를 지원합니다.

최근에는 네이버페이(N Pay)도 지원하기 시작했다고 하네요 '-')!

 

 

그럼 본격적으로 사용법을 알아보도록 하겠습니다.

 

 

먼저 아임포트 홈페이지에 접속합니다

http://www.iamport.kr/

 

 

오른쪽 상단의 연동시작하기를 클릭합니다.

 

 

 

이러한 새 창이 뜰텐데요,

오른쪽 상단의 로그인을 클릭해주세요.

 

 

 

회원가입을 진행해주세요.

간단하게 이메일과 비밀번호를 설정하여 가입하실 수 있습니다!

 

 

로그인을 완료하신 후 시스템설정 메뉴를 클릭하면 다음과 같은 화면을 보실 수 있는데요,

 

여기서 중요한 것은 '가맹점 식별코드' 입니다.

가맹점 식별 코드는 아임포트에서 제공하는 모듈을 사용할 때 가맹점을 구분하기 위해,

관리자 페이지 가입과 동시에 자동 발급되는 고유한 문자입니다.

 

 

 

PG설정(인증방식결제) 를 클릭하시면

테스트해볼 PG사를 선택할 수 있습니다.

물론, 테스트모드를 ON으로 설정해두어야겠죠 :^)

 

 

 

이제 본격적으로 코드 작성을 시작해봅니다.

 

아임포트를 사용하기 위해,

먼저 결제가 필요한 곳에 아임포트의 라이브러리를 추가합니다.

아임포트는 jQuery 기반으로 작동하기 때문에 jQuery 1.0 이상이 설치되어있어야 합니다.

 

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js" ></script>
<script type="text/javascript" src="https://service.iamport.kr/js/iamport.payment-1.1.2.js"></script>

 

 

다음은,  자바 스크립트 안에 들어갈 코드입니다.

var IMP = window.IMP; // 생략가능
   IMP.init('imp50043848');  // 가맹점 식별 코드

   IMP.request_pay({
      pg : 'kakao', // 결제방식
       pay_method : 'card',	// 결제 수단
       merchant_uid : 'merchant_' + new Date().getTime(),
      name : '주문명: 결제 테스트',	// order 테이블에 들어갈 주문명 혹은 주문 번호
       amount : '100',	// 결제 금액
       buyer_email : '',	// 구매자 email
      buyer_name :  '',	// 구매자 이름
       buyer_tel :  '',	// 구매자 전화번호
       buyer_addr :  '',	// 구매자 주소
       buyer_postcode :  '',	// 구매자 우편번호
       m_redirect_url : '/khx/payEnd.action'	// 결제 완료 후 보낼 컨트롤러의 메소드명
   }, function(rsp) {
	if ( rsp.success ) { // 성공시
		var msg = '결제가 완료되었습니다.';
		msg += '고유ID : ' + rsp.imp_uid;
		msg += '상점 거래ID : ' + rsp.merchant_uid;
		msg += '결제 금액 : ' + rsp.paid_amount;
		msg += '카드 승인번호 : ' + rsp.apply_num;
	} else { // 실패시
		var msg = '결제에 실패하였습니다.';
		msg += '에러내용 : ' + rsp.error_msg;
	}
});

 

IMP.request_pay() 파라미터 상세보기

 

 

 

자 여기까지 잘 따라오셨다면 모든 준비가 끝났습니다!

저는 제가 만들었던 프로젝트에 해당 결제 테스트 모듈을 구현해보았었는데요,

 

결제 부분으로 넘어가면 위에 설정해둔 것처럼

카카오 페이로 진행되는 것을 볼 수 있습니다.

 

실제로 해당 결제 기능을 사용하고자 하신다면

아임포트에 이용요금을 지불하여야하지만

 

최초가입비와 연관리비가 무료인

네이버페이, KG모빌리언스, 다날 도 있으니 참고하여 사용해주시면 될 것 같습니다.

제휴프로모션 살펴보기

 

 

 

 

 

여기까지 욘듀였습니다.

궁금하신 사항은 댓글로 남겨주세요.

언제든지 환영입니다♥