[JAVA, SPRING, Iamport] 아임포트 모바일 웹뷰 콜백함수 해결책 및 자바 예제(WEB,APP)

아임포트 특이점

 일부를 제외한 국내 대부분의 PG 사들은모바일 결제가 시작되면 페이지를 이동(redirect)시켜버리는 특징이 있습니다. 이 과정에서 기존 페이지가 unload 되고IMP.request_pay(param, callback)의 callback함수가 메모리에서 해제되어버려 결제 완료 시 callback응답을 받을 수 없는 상태가 된다고 합니다. 예를 들어 핸드폰 크롬 어플로 모바일에서 내 사이트에 들어가서 아임 포트로 개발한 결제를 하게 되면 콜백 함수가 실행이 안되는 거죠.

 

<script>
	function iamport(){
		//가맹점 식별코드
		IMP.init('imp30146952');
		IMP.request_pay({
		    pg : 'kcp',
		    pay_method : 'card',
		    merchant_uid : 'merchant_' + new Date().getTime(),
		    name : '상품1' , //결제창에서 보여질 이름
		    amount : 100, //실제 결제되는 가격
		    buyer_email : 'iamport@siot.do',
		    buyer_name : '구매자이름',
		    buyer_tel : '010-1234-5678',
		    buyer_addr : '서울 강남구 도곡동',
		    buyer_postcode : '123-456'
            
            <!-- 아래 function이 실행되지 않아 결제 검증을 하지 못한다 -->
		}, function(rsp) {
			console.log(rsp);
			// 결제검증
			$.ajax({
	        	type : "POST",
	        	url : "/verifyIamport/" + rsp.imp_uid 
	        }).done(function(data) {
	        	
	        	console.log(data);
	        	
	        	// 위의 rsp.paid_amount 와 data.response.amount를 비교한후 로직 실행 (import 서버검증)
	        	if(rsp.paid_amount == data.response.amount){
		        	alert("결제 및 결제검증완료");
	        	} else {
	        		alert("결제 실패");
	        	}
	        });
		});
	}
</script>

 

위 스크립트에서 주석 부분의 아래를 실행하지 못합니다.

 

 

해결책

아임 포트 자바스크립트에서 IMP.request_pay(param, callback) param 중 m_redirect_url라는 파라미터가 그 역할을 하게 됩니다.

 

1. IMP.request_pay(param, callback) 호출로 결제창 호출
2. PG사 페이지로 이동(redirect)하면서 결제 프로세스 시작
3. 결제 후 m_redirect_url에 지정된 주소로 페이지 이동. 이때,m_redirect_url에 query string으로 imp_uid 와 merchant_uid 가 추가된 주소로 이동됨. (예시. https://www.myservice.com/payment/mobile/success로 지정하면 https://www.myservice.com/payment/mobile/success?imp_uid=imp1234567890&merchant_uid=order12345로 이동됨)

<script>
	function iamport(){
		//가맹점 식별코드
		IMP.init('imp30146952');
		IMP.request_pay({
		    pg : 'kcp',
		    pay_method : 'card',
		    merchant_uid : 'merchant_' + new Date().getTime(),
		    name : '상품1' , //결제창에서 보여질 이름
		    amount : 100, //실제 결제되는 가격
		    buyer_email : 'iamport@siot.do',
		    buyer_name : '구매자이름',
		    buyer_tel : '010-1234-5678',
		    buyer_addr : '서울 강남구 도곡동',
		    buyer_postcode : '123-456',
            		<!-- 아래 부분을 추가해줍니다 -->
		    m_redirect_url : 'http://localhost:8080/orderCompleteMobile'
            		<!-- -->
		}, function(rsp) {
			console.log(rsp);
			// 결제검증
			$.ajax({
	        	type : "POST",
	        	url : "/verifyIamport/" + rsp.imp_uid 
	        }).done(function(data) {
	        	
	        	console.log(data);
	        	
	        	// 위의 rsp.paid_amount 와 data.response.amount를 비교한후 로직 실행 (import 서버검증)
	        	if(rsp.paid_amount == data.response.amount){
		        	alert("결제 및 결제검증완료");
	        	} else {
	        		alert("결제 실패");
	        	}
	        });
		});
	}
</script>

m_redirect_url을 추가하게 되면, 모바일 화면에서는 콜백 함수가 호출되는 것이 아닌, 해당 url만 호출하게 됩니다.

 

검증절차①  JAVA SPRING (자바, 스프링) - orderCompleteMobile함수

@RequestMapping(value="/orderCompleteMobile", produces = "application/text; charset=utf8", method = RequestMethod.GET)
	public String orderCompleteMobile(
			@RequestParam(required = false) String imp_uid
			, @RequestParam(required = false) String merchant_uid
			, Model model
			, Locale locale
			, HttpSession session) throws IamportResponseException, IOException
	{
		
		IamportResponse<Payment> result = api.paymentByImpUid(imp_uid);
		
		// 결제 가격과 검증결과를 비교한다.
		if(result.getResponse().getAmount().compareTo(BigDecimal.valueOf(100)) == 0) {
			System.out.println("검증통과");
		}
		
		return "home";
	}

 

결제가 완료되게 되면 아래 사진처럼 url이 나타나 집니다.

 

orderCompleteMobile m_redirect_url : 'http://localhost:8080/orderCompleteMobile'로 설정을 했기 때문에 그 뒤에  imp_uid와 merchant_uid를 querystring으로 제공해 줍니다. 우리는 이 쿼리 스트링을 활용하여 정상적으로 결제가 됐는지 검증을 하면 됩니다. 

eclipse console

마치며

아임포트에서 파이썬, 루비 등 다양한 예제를 제공하지만 자바 예제가 부족하여 직접 만든 후 시행착오를 기록한 글입니다. 혹시라도 오류나 잘못된 점이 있으면 댓글로 부탁드립니다.

 

 이 정도 정도 예제로 잘 가공해서 사용한다면 java spring DB에 CRUD는 문제없이 사용할 수 있을 겁니다. 혹시라도 구현 진행 중 안 되는 부분이 있으시면 댓글 남겨주시면 소스를 보내드리겠습니다.

 

 위 소스가 진행이 안된다면, 제일 먼저 앞선 예제들을 보시길 바라며 그래도 안되면 요청 부탁드립니다. 감사합니다.

 

 

아임포트 연동(시작) : tyrannocoding.tistory.com/43

[JAVA, SPRING, Iamport] 아임포트 연동(WEB,APP)

아임포트 검증하기 : tyrannocoding.tistory.com/44

[JAVA, SPRING, Iamport] 아임포트 검증하기(WEB,APP)