Search
🌐

웹뷰(WebView) 사용 (카드) - 카드 결제완료 후 상점 앱으로 복귀

1. 웹뷰(WebView) 사용시

[필수] 카드사 및 기관별 결제를 위해 외부 앱을 호출
카드사/기관 앱 스킴을 등록하는 방법은 아래 페이지에서 확인해보세요!
[선택] 카드사 및 기관 앱(외부 앱)에서 결제 완료 후 파트너 앱으로 돌아오기 위한 설정
모바일 앱 환경에서 앱카드 결제 요청 후 카드사 및 기관별 앱(외부 앱)에서 결제를 마친 후,
카드사 및 기관별 앱 정책에 따라 원래 결제를 요청했던 상점 앱으로 돌아오지 않을 수도 있습니다.
해당 설정은 선택사항이나, 편리하고 정상적인 결제를 위해 설정하는 것을 권장합니다.

2. 카드사 및 기관 앱에서 결제 완료 후 상점 앱으로 복귀

모바일 환경에서 앱 카드 결제시, 고객이 선택한 카드사 및 기관의 결제 앱에서 결제를 완료한 후,
다시 상점 앱으로 돌아오기 위해서는 추가 설정이 필요합니다.

2.1 파트너 상점 앱 Custom User Agent 설정

고객이 모바일 환경에서 앱으로 접속하여 결제한건지, 웹으로 접속하여 결제한건지에 대한 구분이 필요합니다.
페이플 결제창을 모바일 환경에서 앱으로 호출시 웹뷰(WebView)를 이용하여 호출하면,
모바일 앱에서 띄운 웹뷰와 모바일 웹(Chrome, Safari 등)이 User Agent 값으로 구분이 되지 않기 때문에
파트너의 모바일 앱에 Custom User Agent 설정을 해주어야 결제 완료 후 상점 앱으로 복귀가 가능합니다.
Custom User Agent 설정을 필수로 하여야만 정상적으로 동작합니다. 모바일 앱에서 띄운 웹뷰인 경우에만 App Scheme 파라미터를 확인하여 카드사/기관 앱에서 결제 완료 후 상점 앱으로 복귀할 수 있으니 아래 부분을 반드시 설정해주시기 바랍니다.
파트너의 상점 앱에서 Custom User Agent로 payple-pay-app 을 추가해주세요.
Android 예시 코드
String userAgent = webView.getSettings().getUserAgentString(); webView.getSettings().setUserAgentString(userAgent+" payple-pay-app");
Java
복사
MainActivity.java
Android Studio Developer 문서 > setUserAgentString 을 참고하여 설정해주세요.
iOS 예시 코드
방법1) WebView configuration.applicationNameForUserAgent에 추가
기본 UserAgent에 페이플 지정 문자열("payple-pay-app") 추가
let configuration = WKWebViewConfiguration() configuration.applicationNameForUserAgent = "payple-pay-app" let webView = WKWebView(frame: .zero, configuration: configuration)
Swift
복사
ViewController.swift
방법2) webView.customUserAgent에 설정
사용자 지정 UserAgent 설정하여 페이플 지정 문자열("payple-pay-app") 추가
let configuration = WKWebViewConfiguration() let webView = WKWebView(frame: .zero, configuration: configuration) ... webView.evaluateJavaScript("navigator.userAgent"){(result, error) in let originUserAgent = result as! String let agent = originUserAgent + " payple-pay-app" self.webView.customUserAgent = agent }
Swift
복사
ViewController.swift
Apple Developer 문서 > applicationNameForUserAgent  와 customUserAgent 을 참고하여 설정해주세요.

2.2 앱카드 결제요청 파라미터 PCD_APP_SCHEME

결제요청 선택 파라미터인 PCD_APP_SCHEME에 파트너의 앱 스킴을 WebViewTest:// 형태로 보내야 합니다.
파트너의 모바일 앱의 User Agent 설정을 한 후,
결제요청시 파라미터로 PCD_APP_SCHEME에 파트너의 모바일 앱 스킴을 보내어 요청하시면
카드사/기관 앱에서 결제 완료 후 파트너의 앱으로 돌아갑니다.
앱카드 결제 요청시에만 해당 파라미터에 앱 스킴을 설정하시어 보내면 되며,
자세한 설명은 앱카드 결제(카드) 가이드와 PCD_APP_SCHEME  에서 확인해주세요!
Payple Inc. All rights reserved.