[Spring Boot] 아임포트(iamport)로 결제 기능 구현

Wonjun Seo·2023년 5월 26일
1

아임포트(iamport)

아임포트는 무료로 PG 결제를 연동해주는 서비스이다. 이니시스, 카카오페이, 네이버 페이, 다날 등 다양한 결제 플랫폼을 프로젝트에 쉽게 연동할 수 있다.

PG

PG(Payment Gateway)는 전자지급결제대행으로 온라인에서 상품이나 서비스를 결제할 때 다양한 결제수단으로 안전하게 결제할 수 있도록 지원하는 서비스를 말한다.

아임포트 연동 순서

  1. 아임포트 계정 생성
  2. 아임포트 가맹점 키 가져오기
  3. PG사 설정 및 코드 작성

1. 아임포트 계정 생성

https://portone.io/korea/ko

해당 URL에 들어가서 계정을 생성한다.

2. 아임포트 가맹점 키 가져오기

계정을 생성했으면 좌측 하단에 있는 "구 관리자콘솔"로 들어간다.

시스템 설정 항목에서 나의 가맹점 식별코드, REST API 키, REST API secret 코드를 확인할 수 있다.

가맹점 식별코드는 JavaScript에서 결제창을 띄우기 위해 사용된다.
REST API 키와 REST API secret은 서버에서 아임포트 API를 연동할 때 필요한 설정 값이다.

3. PG사 설정 및 코드 작성

아임포트에서 제공하는 함수 및 객체를 사용하기 위해서 의존성을 추가해주어야 한다.

maven:

<repositories>
  <repository>
    <id>jitpack.io</id>
    <url>https://jitpack.io</url>
  </repository>
</repositories>

<!-- dependencies 안에 추가합니다 -->
<dependency>
  <groupId>com.github.iamport</groupId>
  <artifactId>iamport-rest-client-java</artifactId>
  <version>0.2.14</version>
</dependency>

gradle:

implementation 'com.github.iamport:iamport-rest-client-java:0.2.21'

allprojects {
    repositories {
        maven { url 'https://jitpack.io' }
    }
}

결제창을 띄우기 위한 HTML과 JavaScript 코드를 작성한다.

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- jQuery -->
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js" ></script>
    <!-- iamport.payment.js -->
    <script type="text/javascript" src="https://cdn.iamport.kr/js/iamport.payment-1.2.0.js"></script>
    <script>
        var IMP = window.IMP; 
        IMP.init("내 가맹점 식별코드"); 
        
        function requestPay() {
            IMP.request_pay({
                pg: "{PG사 코드}.{상점ID}",
                pay_method: "card",
                merchant_uid: "ORD20180131-0000011",   // 주문번호
                name: "노르웨이 회전 의자",
                amount: 64900,                         // 숫자 타입
                buyer_email: "gildong@gmail.com",
                buyer_name: "홍길동",
                buyer_tel: "010-4242-4242",
                buyer_addr: "서울특별시 강남구 신사동",
                buyer_postcode: "01181"
            }, function (rsp) { // callback
                $.ajax({
                   type: 'POST',
                   url: '/verify/' + rsp.imp_uid
                }).done(function(data) {
                    if(rsp.paid_amount === data.response.amount){
                        alert("결제 성공");
                    } else {
                        alert("결제 실패");
                    }
                });
            });
        }
    </script>
    <meta charset="UTF-8">
    <title>Sample Payment</title>
</head>
<body>
    <button onclick="requestPay()">결제하기</button> <!-- 결제하기 버튼 생성 -->
</body>
</html>

PG사 코드는 다음 링크에서 확인할 수 있다.

https://developers.portone.io/docs/ko/tip/pg-2

그 다음은 POST 타입의 결제 인증 요청을 처리하기 위한 Controller를 작성한다.

@Controller
public class PaymentController {

    private final IamportClient iamportClient;

    public PaymentController() {
        this.iamportClient = new IamportClient("REST_API_KEY",
                "REST_API_SECRET");
    }

    @ResponseBody
    @RequestMapping("/verify/{imp_uid}")
    public IamportResponse<Payment> paymentByImpUid(@PathVariable("imp_uid") String imp_uid)
            throws IamportResponseException, IOException {
        return iamportClient.paymentByImpUid(imp_uid);
    }

}

이 때, iamportClient.paymentByImpUid 함수는 imp_uid를 검사하고, 데이터를 보내주게되는데, 이 데이터와 처음 금액이 일치하는지를 확인하여 결제 성공 실패 여부를 리턴한다.

References

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

https://developers.portone.io/docs/ko/readme

0개의 댓글