@tosspayments/payment-sdk 결제 위젯 관련 문의입니다.
토스 페이먼츠 상점 페이지에서는 '결제 실패' 로 표기되는데, sdk 에서 처리된 redirect URL 은 successUrl 인 상황이 발생했습니다.
예시 orderId 값은 'client-advice-14448-12193-1729337857302' 입니다. (이외에도 다수 존재)
아래 내용은 프론트엔드 코드 일부입니다.
예시 orderId 값은 'client-advice-14448-12193-1729337857302' 입니다. (이외에도 다수 존재)
아래 내용은 프론트엔드 코드 일부입니다.
useEffect(() => {
switch (phase) {
case "init":
const { origin, pathname, search } = window.location;
const query = new URLSearchParams(search);
query.delete("orderId");
query.delete("amount");
loadTossPayments(process.env.NEXT_PUBLIC_TOSS_CLIENT_KEY).then(({ requestPayment }) =>
requestPayment("카드", {
amount: Number(amount),
orderId,
orderName,
successUrl: origin + pathname.replace("init", "success") + "?" + query,
failUrl: origin + pathname.replace("init", "failure") + "?" + query,
}).catch((error) => {
console.error(error);
alert("결제를 취소합니다.");
window.history.go(-2);
}),
);
return;
case "success":
router.push({ pathname: onSuccess, query: { ...router.query, paymentId: paymentKey } });
return;
case "failure":
router.push({ pathname: onFailure, query: { ...router.query, errorCode, errorMessage } });
return;
}
}, []);useEffect(() => {
switch (phase) {
case "init":
const { origin, pathname, search } = window.location;
const query = new URLSearchParams(search);
query.delete("orderId");
query.delete("amount");
loadTossPayments(process.env.NEXT_PUBLIC_TOSS_CLIENT_KEY).then(({ requestPayment }) =>
requestPayment("카드", {
amount: Number(amount),
orderId,
orderName,
successUrl: origin + pathname.replace("init", "success") + "?" + query,
failUrl: origin + pathname.replace("init", "failure") + "?" + query,
}).catch((error) => {
console.error(error);
alert("결제를 취소합니다.");
window.history.go(-2);
}),
);
return;
case "success":
router.push({ pathname: onSuccess, query: { ...router.query, paymentId: paymentKey } });
return;
case "failure":
router.push({ pathname: onFailure, query: { ...router.query, errorCode, errorMessage } });
return;
}
}, []);
