RN에서 Webview로 결제위젯을 띄울 때 requestPayment 호출 문의드립니다.
안녕하세요.
결제 위젯을 띄우고 싶어서 RN에서 Webview로 위젯을 그렸습니다.
그런데 결제하기 버튼을 만들어서 requestPayment 함수를 호출하는데 결제 창이 뜨질 않아서요
어디가 문제인지 몰라서 질문을 남깁니다.
const WEBVIEW_SOURCE_HTML =
이렇게 구성을 했는데요, 버튼을 클릭해서 requestPayment를 호출했을 때 결제 창이 뜨기를 기대했습니다만 아무런 반응이 없습니다.
어느 부분이 부족했을까요?
결제 위젯을 띄우고 싶어서 RN에서 Webview로 위젯을 그렸습니다.
그런데 결제하기 버튼을 만들어서 requestPayment 함수를 호출하는데 결제 창이 뜨질 않아서요
어디가 문제인지 몰라서 질문을 남깁니다.
const WEBVIEW_SOURCE_HTML =
<html>
<head>
...
<script src="https://js.tosspayments.com/v1/payment-widget"></script>
</head>
<body>
<div id="payment-method"></div
<button id="payment-request-button">결제하기</button>
<script>
const clientKey = '${clientKey}' // 상점을 특정하는 키
const amount = '${payment.amount}' // 결제 금액
const orderId = '${payment.orderId}' // 주문번호
const orderName = '${payment.orderName}' // 주문명
/*결제위젯 영역 렌더링*/
const paymentWidget = PaymentWidget(clientKey, PaymentWidget.ANONYMOUS) // 회원 결제 초기화
paymentMethods = paymentWidget.renderPaymentMethods('#payment-method', amount)
const button = document.getElementById('#payment-request-button') // 결제하기 버튼
button.addEventListener('click', () => {
paymentWidget.requestPayment({
orderId: orderId,
amount: amount,
customerName: '',
customerEmail: '',
orderName: orderName,
appScheme: 'YOUR_APP_SCHEME://',
successUrl: 'tosspayments://payment/success',
failUrl: 'tosspayments://payment/fail'
}).catch(err => {
window.ReactNativeWebView.postMessage(JSON.stringify(err))
})
})
</script>
</body>
</html>
<html>
<head>
...
<script src="https://js.tosspayments.com/v1/payment-widget"></script>
</head>
<body>
<div id="payment-method"></div
<button id="payment-request-button">결제하기</button>
<script>
const clientKey = '${clientKey}' // 상점을 특정하는 키
const amount = '${payment.amount}' // 결제 금액
const orderId = '${payment.orderId}' // 주문번호
const orderName = '${payment.orderName}' // 주문명
/*결제위젯 영역 렌더링*/
const paymentWidget = PaymentWidget(clientKey, PaymentWidget.ANONYMOUS) // 회원 결제 초기화
paymentMethods = paymentWidget.renderPaymentMethods('#payment-method', amount)
const button = document.getElementById('#payment-request-button') // 결제하기 버튼
button.addEventListener('click', () => {
paymentWidget.requestPayment({
orderId: orderId,
amount: amount,
customerName: '',
customerEmail: '',
orderName: orderName,
appScheme: 'YOUR_APP_SCHEME://',
successUrl: 'tosspayments://payment/success',
failUrl: 'tosspayments://payment/fail'
}).catch(err => {
window.ReactNativeWebView.postMessage(JSON.stringify(err))
})
})
</script>
</body>
</html>
이렇게 구성을 했는데요, 버튼을 클릭해서 requestPayment를 호출했을 때 결제 창이 뜨기를 기대했습니다만 아무런 반응이 없습니다.
어느 부분이 부족했을까요?
