모바일 웹뷰앱에서 결제위젯 연동 문의드립니다.
리액트 웹에서 아래와 같은 형태로 결제 위젯을 구현하고 있습니다.
try {
// 토스 결제는 무조건 카드 결제
const method = "C";
// 결제 요청
await widgets.requestPayment({
orderId: orderId, // 주문 ID
orderName: productName, // 주문명
customerName: buyerName, // 구매자명
successUrl:
failUrl: window.location.href, // 결제 실패시 리다이렉트 URL(구매하기 페이지에 머물게함)
});
} catch (error: any) {
// 에러 발생 시 서버에 결제 취소 요청
try {
await deletePayment(order_id);
// 사용자가 결제를 취소한 경우
if (error.code === "USER_CANCEL") {
console.log("사용자가 결제를 취소했습니다.");
} else {
console.error("결제 중 에러 발생:", error.message);
}
} catch (apiError) {
console.error("결제 취소 중 에러 발생:", apiError);
}
}
};
웹에서 각 은행사별 결제창에서 닫기창을 누르면 에러 쪽으로 호출이 잘 들어오는데
해당앱을 웹뷰로 패키징해서 모바일 환경에서 실행하는 경우 은행사별 결제창에서 뒤로 가기를 했을 때는 에러쪽으로 호출이 되지 않습니다.
모바일에서 사용자가 취소했을때는 다른 방법으로 감지해야하는건가요?
try {
// 토스 결제는 무조건 카드 결제
const method = "C";
// 결제 요청
await widgets.requestPayment({
orderId: orderId, // 주문 ID
orderName: productName, // 주문명
customerName: buyerName, // 구매자명
successUrl:
${window.location.origin}/success?method=${method}failUrl: window.location.href, // 결제 실패시 리다이렉트 URL(구매하기 페이지에 머물게함)
});
} catch (error: any) {
// 에러 발생 시 서버에 결제 취소 요청
try {
await deletePayment(order_id);
// 사용자가 결제를 취소한 경우
if (error.code === "USER_CANCEL") {
console.log("사용자가 결제를 취소했습니다.");
} else {
console.error("결제 중 에러 발생:", error.message);
}
} catch (apiError) {
console.error("결제 취소 중 에러 발생:", apiError);
}
}
};
웹에서 각 은행사별 결제창에서 닫기창을 누르면 에러 쪽으로 호출이 잘 들어오는데
해당앱을 웹뷰로 패키징해서 모바일 환경에서 실행하는 경우 은행사별 결제창에서 뒤로 가기를 했을 때는 에러쪽으로 호출이 되지 않습니다.
모바일에서 사용자가 취소했을때는 다른 방법으로 감지해야하는건가요?
Toss payments 개발자 커뮤니티입니다. 결제 연동하며 겪는 기술 문의부터, 결제 시장에 대한 다양한 정보까지 얻어가세요~
15,588Members
Resources
Recent Announcements
Similar Threads
Was this page helpful?
