리액트네이티브 웹뷰로 브랜드페이 연동하기
안녕하세요 v2에 있는 브랜드페이 기능 중 결제 수단 변경 관련 UI 및 API를 사용하려고 합니다.
v2는 RN을 지원하지 않는다고 해서, 웹뷰로 작업중인데요.
const TossPaymentMethod = () => {
const webViewRef = useRef(null);
const [customerKey, setCustomerKey] = useState('f9KC7GDaHr-VKUE9XJT_W');
const htmlContent =
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://js.tosspayments.com/v2/standard"></script>
</head>
<body>
<h2>결제 수단 변경</h2>
<script>
const clientKey = "${Config.TOSS_PAYMENT_CLIENTKEY}";
const customerKey = "${customerKey}";
const tossPayments = TossPayments(clientKey);
const brandpay = tossPayments.brandpay({customerKey, redirectUrl: "/"});
brandpay.openSettings();
</script>
</body>
</html>
;
return <WebView ref={webViewRef} source={{html: htmlContent}} />;
};
이렇게 코드를 작성해서 테스트를 해봤는데 오류가 발생했다는 문구만 뜨고 이 이상 진행되지 않고 있습니다.
혹시 리액트 네이티브에서는 결제 수단 변경과 관련해서 위젯또는 API 사용이 어려운 걸까요?
7 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
혹시 어떤 웹뷰 컴포넌트 쓰시는지 알수 있을까요?
왜 v2 sdk를 쓰려고 하시나요? v1 sdk를 사용하셔도 됩니다.
이건 ios webview 쪽 버그여서요.
"react-native-webview": "13.6.2" 쓰고 있습니다
https://docs.tosspayments.com/guides/v2/brandpay#%EA%B2%B0%EC%A0%9C-%EA%B4%80%EB%A6%AC 결제 수단 관리하는 위젯을 사용해야해서 v2를 쓰려고 합니다. ios webview 버그로 v2를 못 쓰는 상황인가요?
브랜드페이 이해하기 | 토스페이먼츠 개발자센터
브랜드페이로 내 상점만의 자체 간편결제를 구현해보세요. 브랜드페이가 제공하는 기능과 구현 방식을 소개합니다.
이건 v1에서도 사용가능하긴해요
아 어차피 브랜드페이만 쓰실거면 v1/v2관련이 없겠네요
rnsdk는 결제위젯을 제공해서요
그러면 브랜드페이는 애초에 로컬에서 사용을 못하실거에요.
redirectUrl 인증이 ㄹ불가해서요
웹서버에 올려서 사용하시면 문제없을겁니다
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.