V1구버전 개발자센터
V2신버전 개발자센터

웹뷰 연동 주의사항

모바일 웹뷰에서 앱카드 결제창을 사용할 때는, 각 카드사 및 기관의 결제를 처리하기 위해 외부 앱 호출이 필요합니다.
앱 스킴 PCD_APP_SCHEME 파라미터를 추가하면 결제 후 파트너(상점) 앱으로 돌아올 수 있습니다.

Android

  1. 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>
  2. 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>
  3. 외부(카드사, 기관) 앱에서 결제를 마친 후 파트너(상점) 앱으로 이동시키려면 User Agent 내 payple-pay-app을 추가해주세요.
    String userAgent = webView.getSettings().getUserAgentString();webView.getSettings().setUserAgentString(userAgent+"payple-pay-app");
  4. 앱카드 결제창 호출 시 사용하는 파라미터인 PCD_APP_SCHEME 에는 WebViewTest:// 형태의 파트너 앱 스킴을 추가해주세요.

iOS

  1. 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>
  2. 파트너(상점) 앱으로의 복귀를 위해 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}
  3. 앱카드 결제창 호출 시 사용하는 파라미터인 PCD_APP_SCHEME 에는 WebViewTest:// 형태의 파트너 앱 스킴을 추가해주세요.
결제 연동과 관련된 무엇이든 물어보세요