I'mport(아임포트)를 이용한 결제 api 사용법(1)

팀 프로젝트로 웹 쇼핑몰을 선택한 나는 결제 부분을 맡게 되었다. 결제 API키워드로 구글링을 하던 중 가장 상단에 위치한 아임포트 사이트를 발견하였다. 이렇게 간편하게 교육생 신분으로 결제 기능을 구현할 수 있다니 ㅠㅠ

 

아임포트(I'mport)는 개발자의 입장에서 결제 모듈 연동을 쉽게 할 수 있는 결제 플랫폼 혹은 결제 호스팅 서비스이다.

 

 

https://www.iamport.kr/

개발자를 위한 무료 결제연동 API, 아임포트

 

 

 

우측 상단의 대시보드를 클릭하여 아이디를 만든 후 로그인 진행을 해주자.

 

 

 

관리자 페이지화면

 

 

로그인 한 뒤 관리자 페이지에서 시스템 설정을 클릭해 준다. 사용자가 API를 사용하여 결제완료 후 결제 결과를 조회할 수 있도록 하기 위해서 REST API 키가 제공되어진다.

 

 

 

관리자 페이지

 

 

우리에게 주어진 REST API 키와 가맹점 식별코드를 기억하자. 그리고 다른 사람에게 절대 유출되지 않도록 주의하자.

 

 

 

REST API KEY와 가맹점 식별코드를 GET! 잘 기억하자

 

 

 

PG설정으로 이동하자. 우리는 현재 결제 시스템을 테스트하려 한다. 그러므로 테스트 모드의 ON 버튼을 활성화 시켜주자. PG사를 클릭하면 핫한 결제 방식인 카카오페이, 네이버페이부터 실제 쇼핑몰에서 사용하는 KG이니시스 방식까지 다양한 방법의 결제 방식들을 선택할 수 있다. 

 

 

 

PG설정을 자신이 쓰고 싶은 방식대로 바꿔보자

 

 

 

자! 이제 모든 준비는 끝났다. 실제 쇼핑몰 결제 방식을 구현하러 GO GO

참고로 나의 경우에는 Spring frame work에서 java를 개발 언어로 사용하고 있다.

 

 

아임포트 라이브러리를 추가해주자

 

 

위의 코드를 통해 아임포트 라이브러리를 사용할 수 있게 되었다.

 

 

 

IMP.init의 값에 자신의 가맹점 식별 코드를 삽입해준 뒤 결제창을 호출하는 코드를 추가 작성해준다.

 

 

 

서버 실행을 해주면? 

짜잔!

 

 

 

결제창 호출 성공!

 

 

쇼핑몰에서 내가 보던 결제창을 이렇게 간단히 구현할 수 있다.

실제 결제를 진행해보자, 나의 통장에서 돈이 빠져나가는 것을 확인할 수 있을 것이다.

 

 

 

 

카카오페이를 이용했더니 카카오톡으로 결제 메세지가 날아왔음을 확인 할 수 있다.

 

 

아니 진짜 금액이 결제됐네?

 

자 이제 실 결제된 금액을 취소해보자. 아까 로그인 한 아임웹 홈페이지에서 관리자 페이지의 결제 승인 내역으로 이동하자. 현재 결제된 결제내역이다. 앞서 입력한 코드의 내용대로 결제된 내역을 볼 수 있다. 그 다음 하단의 이미지 처럼 취소하기 버튼이 활성화 된 것을 확인 할 수 있는데 이 버튼을 클릭하면 결제를 취소할 수 있다.

 

 

 

결제 내역. 취소하기를 통해 결제를 취소해보자

 

 

 

오늘은 간단한 결제 창 호출 페이지를 구현해보았다. 계속해서 거래내역 데이터를 Ajax를 통해 비동기 방식으로 날려주고 DB에 저장하는 프로그램을 구현해 볼 계획이다~ 그럼 다음 시간에 계속!!