웹뷰 결제 문의드립니다.
payment.requestPayment({
method: "CARD",
amount: {
currency: "KRW",
value: 50000,
},
orderId: "UwTt4ep8hEj628WjZ2rQO",
orderName: "토스 티셔츠 외 2건",
successUrl: window.location.origin + "/success.html",
failUrl: window.location.origin + "/fail.html",
customerEmail: "customer123@gmail.com",
customerName: "김토스",
card: {
useEscrow: false,
flowMode: "DIRECT",
useCardPoint: false,
useAppCardOnly: false,
appScheme :"test://"
},
});
1. 개발 환경
플랫폼: 리액트 네이티브 웹뷰
결제 API: Toss Payments의 payment.requestPayment() 함수
저희 프로젝트는 모바일 웹과 앱 모두에서 동일한 웹 페이지를 사용하며, 앱에서는 리액트 네이티브 웹뷰를 사용하여 웹 콘텐츠를 표시
현재 가장 큰 문제는 앱에서 결제 시 모바일 웹창이 열리고 거기서 KB카드/하나카드 테스트 시 다른 결과가 나와서요.
저희 url에 앱링크를 설정해 놓은 상태인데 KB카드는 결제 후에 앱으로 연결이 됩니다.
하지만 하나카드 선택해서 앱 결제 한 후에는 앱으로 돌아오지를 않더라구요.
모든 카드를 테스트 하지 못했지만 안돌아오는 경우가 더 있을 거라 생각됩니다.
웹뷰를 감싼 앱에서 저 함수를 호출 => 모바일창이 뜸 => 하나카드 결제 선택
=> 하나카드 앱열리고 결제수단 인증하고 결제 완료 => 처음 모바일창으로 돌아옴 => 거기서 리턴url이 변경되는데 앱이 열리지 않고 모바일창에서 그 주소로 연결이 됨
https://docs.tosspayments.com/guides/v2/webview#%EC%95%B1%EC%8A%A4%ED%82%B4-%EB%A6%AC%EC%8A%A4%ED%8A%B8
웹뷰 연동하기를 참고하여 앱스킴리스트를 등록해봤으나 모바일 웹창으로 넘어가네요.
위와 같은 결제 흐름이 Toss의 예상 동작인가요?
차라리 저렇게 되어야한다면 앱에서 저 함수 호출 시에 모바일 웹창이 연결안되고 앱내에서 뜨기라도 했으면 좋겠습니다.
그리고 앱스킴 리스트들은 저 함수 이용할 시에는 아무 상관이 없나요?
알려주시면 감사하겠습니다!!
웹뷰(WebView) 연동하기 | 토스페이먼츠 개발자센터
모바일 웹뷰 결제는 앱투앱(App to App) 이동이 필요한데요. 결제기관의 앱스킴 목록과 OS별 이동 방법을 알아보세요.
4 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
웹뷰를 감싼 앱에서 저 함수를 호출 => 모바일창이 뜸 => 하나카드 결제 선택
라고하셨는데요 모바일 창이라는게 외부 브라우저가 뜨시는건가요?
만약 그렇다면 웹뷰에서 특정 도메인이 아니면 외부 브라우저를 호출하도록 되어 있는게 아닌지 확인부탁드립니다.
기본적으로 웹뷰를 감싼 앱에서 저 함수를 호출 하면 그 창에서 바로 결제창으로 redirection 이 되어야 합니다.
알겠습니다. 다시 테스트 후에 문제 발생 시 다시 문의드리겠습니다.
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.