웹뷰 연동 주의사항
모바일 웹뷰에서 앱카드 결제창을 사용할 때는, 각 카드사 및 기관의 결제를 처리하기 위해 외부 앱 호출이 필요합니다.
앱 스킴 PCD_APP_SCHEME 파라미터를 추가하면 결제 후 파트너(상점) 앱으로 돌아올 수 있습니다.
Android
- AndroidManifest.xml 파일에 아래 패키지를 등록합니다.
<queries><!-- 보안 --><package android:name="com.ahnlab.v3mobileplus"/><package android:name="com.TouchEn.mVaccine.webs"/> <!-- 우리카드 --><package android:name="com.wooricard.wpay"/><package android:name="com.wooricard.smartapp"/><package android:name="com.wooribank.smart.npib"/><package android:name="com.mysmilepay.app"/> <!-- 씨티카드 --><package android:name="kr.co.citibank.citimobile"/><package android:name="com.citibank.cardapp"/> <!-- 신한카드 --><package android:name="com.shcard.smartpay"/><package android:name="com.shinhancard.smartshinhan"/><package android:name="com.shinhan.smartcaremgr"/><package android:name="com.mobiletoong.travelwallet"/> <!-- ISP/페이북 --><package android:name="kvp.jjy.MispAndroid320"/> <!-- KB카드 --><package android:name="com.kbcard.cxh.appcard"/><package android:name="com.kbstar.reboot"/><package android:name="com.kbstar.kbbank"/><package android:name="com.kbstar.liivbank"/> <!-- 현대카드 --><package android:name="com.hyundaicard.appcard"/><package android:name="com.samsung.android.spaylite"/><package android:name="com.ssg.serviceapp.android.egiftcertificate"/> <!-- 삼성카드 --><package android:name="kr.co.samsungcard.mpocket"/><package android:name="com.nhnent.payapp"/><package android:name="com.samsung.android.spaylite"/><package android:name="net.ib.android.smcard"/> <!-- 하나카드 --><package android:name="com.hanaskcard.paycla"/><package android:name="kr.co.hanamembers.hmscustomer"/><package android:name="com.samsung.android.spaylite"/><package android:name="com.kakao.talk"/><package android:name="com.hanaskcard.rocomo.potal"/><package android:name="com.ahnlab.v3mobileplus"/><package android:name="com.lge.lgpay"/><package android:name="viva.republica.toss"/><package android:name="com.samsung.android.spay"/><package android:name="com.nhnent.payapp"/> <!-- 롯데카드 --><package android:name="com.lcacApp"/><package android:name="com.lotte.lpay"/><package android:name="com.nhnent.payapp"/><package android:name="com.lottemembers.android"/><package android:name="com.samsung.android.spaylite"/> <!-- 농협카드 --><package android:name="nh.smart.nhallonepay"/></queries>
- WebViewClient의
shouldOverrideUrlLoading함수를 재정의(Override) 합니다.
재정의하지 않으면net::ERR_UNKNOWN_URL_SCHEME오류가 발생합니다.@Overridepublic boolean shouldOverrideUrlLoading (WebView view, String url){ if (url == null) return false; if (!url.startsWith("http://") && !url.startsWith("https://")) { if (url.startsWith("intent")) { Intent schemeIntent; try { schemeIntent = Intent.parseUri(url, Intent.URI_INTENT_SCHEME); } catch (URISyntaxException e) { e.printStackTrace(); return false; } try { startActivity(schemeIntent); return true; } catch (ActivityNotFoundException e) { String pkgName = schemeIntent.getPackage(); if (pkgName != null) { startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse("market://details?id=" + pkgName))); return true; } } } else { try { startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url))); return true; } catch (Exception e) { e.printStackTrace(); return false; } } } return false;}
Android 11 (API Level 30)에서
net::ERR_UNKNOWN_URL_SCHEME오류가 발생한다면, AndroidManifest.xml 파일의usesCleartextTraffic속성을 true로 설정해주세요.<manifest> <application ... android:usesCleartextTraffic="true" ... > </application></manifest>
- 외부(카드사, 기관) 앱에서 결제를 마친 후 파트너(상점) 앱으로 이동시키려면 User Agent 내
payple-pay-app을 추가해주세요.String userAgent = webView.getSettings().getUserAgentString();webView.getSettings().setUserAgentString(userAgent+"payple-pay-app");
- 앱카드 결제창 호출 시 사용하는 파라미터인
PCD_APP_SCHEME에는WebViewTest://형태의 파트너 앱 스킴을 추가해주세요.
iOS
- Info.plist 에
LSApplicationQueriesSchemes를 추가하고 앱 스킴을 배열에 넣어 주세요.<key>LSApplicationQueriesSchemes</key><array> <string>itmss</string> <string>itms-appss</string> <string>itms</string> <string>itms-apps</string> <string>shinhan-sr-ansimclick</string> <string>shinhan-sr-ansimclick-payco</string> <string>shinhan-sr-ansimclick-naverpay</string> <string>smshinhanansimclick</string> <string>hdcardappcardansimclick</string> <string>smhyundaiansimclick</string> <string>mpocket.online.ansimclick</string> <string>scardcertiapp</string> <string>cloudpay</string> <string>hanaskcardmobileportal</string> <string>nhappcardansimclick</string> <string>nonghyupcardansimclick</string> <string>kb-acp</string> <string>lotteappcard</string> <string>lottesmartpay</string> <string>citispay</string> <string>kpay</string> <string>ispmobile</string> <string>paypin</string> <string>payco</string> <string>tswansimclick</string> <string>nhallonepayansimclick</string> <string>citimobileapp</string> <string>citicardappkr</string> <string>lpayapp</string> <string>kakaotalk</string> <string>shinsegaeeasypayment</string> <string>kftc-bankpay</string> <string>bankwallet</string> <string>uppay</string> <string>banka</string> <string>hanamopmoasign</string> <string>iphoneSbank</string> <string>wooripay</string> <string>tauthlink</string> <string>lguthepay</string> <string>lguthepay-xpay</string> <string>smartxpay-transfer</string> <string>nhappcash-acp</string> <string>SmartBank2WIB</string> <string>SmartBank2WB</string> <string>PortalCenterWB</string> <string>woorimembers</string> <string>com.wooricard.wcard</string> <string>NewSmartPib</string> <string>wibeetalk</string> <string>ansimclickscard</string> <string>ansimclickipcollect</string> <string>vguardstart</string> <string>samsungpay</string> <string>monimopay</string> <string>monimopayauth</string> <string>hanawalletmembers</string> <string>ktauthexternalcall</string> <string>payprotocolwalletkr</string> <string>newliiv</string> <string>kbbank</string> <string>supertoss</string> <string>liivbank</string> <string>upluscorporation</string> <string>lmslpay</string> <string>naversearchthirdlogin</string> <string>kb-bankpay</string></array>
- 파트너(상점) 앱으로의 복귀를 위해 Custom User Agent 설정이 필요하므로
configuration.applicationNameForUserAgent또는webView.customUserAgent에payple-pay-app을 추가해주세요.let configuration = WKWebViewConfiguration()configuration.applicationNameForUserAgent = "payple-pay-app"let webView = WKWebView(frame: .zero, configuration: configuration)
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}
- 앱카드 결제창 호출 시 사용하는 파라미터인
PCD_APP_SCHEME에는WebViewTest://형태의 파트너 앱 스킴을 추가해주세요.