Django – iamport

by

본 글은 결제 서비스를 구현하기 위해 iamport를 사용하였다. 구현하는 현재로서 무료로 1개 PG사, 기본 관리자대시보드를 제공해준다. 복수 PG의 경우 요금이 발생한다. https://www.iamport.kr/

iamport 설치

pip3 install iamport-rest-client

template에서 다음 코드를 이용해 iamport에서 제공하는 결제시스템을 이용한다. jquery 를 불러와 iamport 결제시스템과 연결한다. 

<!-- 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.1.5.js"></script>
iamport 공식 사이트에 가입하여 관리자 대시보드에 진입하여 시스템설정 탭에서 가맹점 식별코드를 복사하여 다음 코드 변수에 적용한다. 
var IMP = window.IMP;
// 가맹점 코드
IMP.init('가맹점코드를 입력하여주세요');
아래 코드는 HTML Body에서 사용자로부터 받은 input 태그에 입력된 내용들을 받아오는 코드이다. 
var amount = parseInt($('#total').val().replace(',', ''));
var product = ($('#product').val());
var type = $('.charge-type input:checked').val();
var buyuser = ($('#buyuser').val());
var merchant_uid ='merchant_' + new Date().getTime()
본 개발에서는 폼을 받아와 성공하면 결제 데이터를 저장하는 로직이 있는 뷰로 이동하는 action 값을 지정하여 주었다. 
var form = document.userinput;
이하 코드는 uid를 저장하기 위해 uid를 input value 속성값에 넣어주었다. 
($('#merchant_uid').val(merchant_uid));
form.action="/billing/create/"
form.submit();
이하 전체 코드

<head>
    <meta charset="UTF-8">
    <title>결제</title>
   <!-- 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.1.5.js"></script>
    <script type="text/javascript">
       $(function () {
            var IMP = window.IMP;
            // 가맹점 코드
            IMP.init('가맹점코드를 입력하여주세요');
            $('.charge-button').on('click', function (e) {
                var amount = parseInt($('#total').val().replace(',', ''));
                var product = ($('#product').val());
                var type = $('.charge-type input:checked').val();
                var buyuser =  ($('#buyuser').val());
                var merchant_uid ='merchant_' + new Date().getTime()
                IMP.request_pay({
                    pg : 'html5_inicis',
                    pay_method : type,
                    merchant_uid : merchant_uid,
                    name : product,
                    amount : amount,
                    buyer_email : 'iamport@siot.do',
                    buyer_name : buyuser,
                    buyer_tel : '010-1234-5678',
                    buyer_addr : '주소주소',
                    buyer_postcode : '123-456',
                    m_redirect_url : 'https://www.yourdomain.com/payments/complete'
                }, function(rsp) {
                    var form = document.userinput;
                    if ( rsp.success ) {
                        var msg = '결제가 완료되었습니다.';
                        msg += '고유ID : ' + rsp.imp_uid;
                        msg += '상점 거래ID : ' + rsp.merchant_uid;
                        msg += '결제 금액 : ' + rsp.paid_amount;
                        msg += '카드 승인번호 : ' + rsp.apply_num;
                        ($('#merchant_uid').val(merchant_uid));
                        form.action="/billing/create/"
                        form.submit();
                    } else {
                        var msg = '결제에 실패하였습니다.';
                        msg += '에러내용 : ' + rsp.error_msg;
                        alert(msg);
                        form.action="/billing/"
                        form.submit();
                    }
                });
            });
    });
    </script>
{% block title %}주문{% endblock %}
	{% block main_title %}주문{% endblock main_title %}
</head>
{% include 'base.html' %}
{% block contents %}
<form name='userinput' method="POST" >
    {% csrf_token %}
    <input name="cartpk" value="{{cartpk}}" type="hidden">
<div class="charge-type">
        <input type="hidden" name='merchant_uid' value="" id='merchant_uid'>
    <div>
        상품명 : <input readonly type="text" name='product' id='product' value="{{product}}">
    </div>
    <div>
        주문 개수 : <input readonly type="text" name='quantity' id='quantity' value="{{quantity}}">
    </div>
    <div>
        주문 단가 : <input readonly type="text" name='price' id='price' value="{{price}}">
    </div>
    <div>
        주문자 : <input readonly type="text" name='buyuser' id='buyuser' value="{{user}}">
    </div>
    <div class="billing-title">
        결제방식
    </div>
    <div class="billing-radio">
        <label class="control control--radio">
            <input type="radio" name="type" value="card" checked="checked"/>
            신용카드
        </label>
        <label class="control control--radio">
            <input type="radio" name="type" value="trans"/>
            실시간 계좌이체
        </label>
        <label class="control control--radio">
            <input type="radio" name="type" value="phone"/>
            휴대폰
        </label>
        <label class="control control--radio">
            <input type="radio" name="type" value="vbank"/>
            가상계좌 입금
        </label>
    </div>
</div>
<div class="charge-total">
    총 결제금액 <input readonly type="text" id='total' name='total' value="{{total}}">
</div>
<div class="charge-click">
    <input type='button' class="charge-button btn btn-primary rounded-pill" value="충전하기"></button>
</div>
</form>
{% endblock %}

* 참조 : http://debtolee.pe.kr

Leave a Comment