안녕하세요, 오랜만에 다시 인사드리는 욘듀입니다!
이번 포스트에서는 아이엠포트를 사용한 결제 구현을 진행해보려고 합니다 'v')
실제로 결제를 해볼 수 있는 '테스트' 버젼을 체험해볼 예정입니다!
아임포트(I'mport;)는 개발자를 위한 무료 결제 연동 서비스인데요
신용카드, 계좌이체, 휴대폰 소액결제, 카카오 페이 등 다양한 결제 서비스를 지원합니다.
최근에는 네이버페이(N Pay)도 지원하기 시작했다고 하네요 '-')!
그럼 본격적으로 사용법을 알아보도록 하겠습니다.
먼저 아임포트 홈페이지에 접속합니다
오른쪽 상단의 연동시작하기를 클릭합니다.
이러한 새 창이 뜰텐데요,
오른쪽 상단의 로그인을 클릭해주세요.
회원가입을 진행해주세요.
간단하게 이메일과 비밀번호를 설정하여 가입하실 수 있습니다!
로그인을 완료하신 후 시스템설정 메뉴를 클릭하면 다음과 같은 화면을 보실 수 있는데요,
여기서 중요한 것은 '가맹점 식별코드' 입니다.
가맹점 식별 코드는 아임포트에서 제공하는 모듈을 사용할 때 가맹점을 구분하기 위해,
관리자 페이지 가입과 동시에 자동 발급되는 고유한 문자입니다.
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;
}
});
자 여기까지 잘 따라오셨다면 모든 준비가 끝났습니다!
저는 제가 만들었던 프로젝트에 해당 결제 테스트 모듈을 구현해보았었는데요,
결제 부분으로 넘어가면 위에 설정해둔 것처럼
카카오 페이로 진행되는 것을 볼 수 있습니다.
실제로 해당 결제 기능을 사용하고자 하신다면
아임포트에 이용요금을 지불하여야하지만
최초가입비와 연관리비가 무료인
네이버페이, KG모빌리언스, 다날 도 있으니 참고하여 사용해주시면 될 것 같습니다.
여기까지 욘듀였습니다.
궁금하신 사항은 댓글로 남겨주세요.
언제든지 환영입니다♥
'dev' 카테고리의 다른 글
javascript : XMLHttpRequest를 사용하여 서버시간 추출하기 (1) | 2017.10.11 |
---|---|
아마존 DB 오라클 로컬로 옮겨오기 (0) | 2017.08.17 |
myBatis : INSERT 후 시퀀스값 가져오기 (oracle) (0) | 2017.08.07 |
highlight.js 를 블로그에 옮기기 (0) | 2017.06.18 |