React SPA 으로 개발 했을떼 결제 완료 후 리다이렉트
checkout -> 결제 모듈 -> 결제 완료 페이지
결제모듈 -> 결제 완료 페이지를 이동하는 과정에서 리액트 같이 SPA으로 개발하면 리다이렉트가 발생하면 state(redux store) 정보가 다 날아가고 포퍼먼스 비효율이 발생한다고 생각 되는데 어떻게 생각하는지 궁금합니다.
리다이렉트가 강제화 되어 있어서 조금 불편하네요. (리다이렉트 모바일은 강제화 막혀있음)
리다이렉트가 강제화 되어 있어서 조금 불편하네요. (리다이렉트 모바일은 강제화 막혀있음)
7 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
카드사나 간편결제 사들이 저런 방식으로만 제공하기 때문에 어쩔수가 없습니다.
흠. 아임포트 - 나이스페이 세팅할때는 리다이렉션 방법을 개발자에게 제공해줬었거든요.
그리고 토스에서 강제로 데스크탑에서는 가능한데 모바일에서는 할수 있는 방법이 없더라구요. 그래서 모바일에서만 가능하도록 세팅해주면 될듯도 한데. 아쉽네요.
Promise로 처리하기
✔️ PC 환경에서만 사용하세요. 모바일 환경에서 Promise를 사용하면 결제가 안 됩니다.
✔️ requestPayment()의 successUrl, failUrl 파라미터를 설정하지 마세요.
✔️ 응답 데이터를 then, catch로 확인하세요.
예시
paymentWidget
.requestPayment({
// 결제 정보 파라미터
// successUrl, failUrl 파라미터를 넘기지 마세요.
})
.then(function (data) {
// 성공 처리: 서버 측에서 결제 승인 API를 호출하세요
})
.catch(function (error) {
// 에러 처리: 에러 목록을 확인하세요
// https://docs.tosspayments.com/sdk/v2/error-codes#failurl로-전달되는-에러
if (error.code === "USER_CANCEL") {
// 구매자가 결제창을 닫았을 때 에러 처리
} else if (error.code === "INVALID_CARD_COMPANY") {
// 유효하지 않은 카드 코드에 대한 에러 처리
}
});
토스페이먼츠 SDK 에러 코드 | 토스페이먼츠 개발자...
토스페이먼츠 SDK를 사용할 때 발생할 수 있는 모든 에러를 살펴보세요.
포트원 나이스페이쪽은 어떻게 되어있는지 한번 알아봐야 겠는데
아이프레임 안에서 결제 창이 로드되면 이슈가 자주 발생해서 토스는 강제하고 있습니다.
그렇군요. 다양한 이슈들의 방어 로직이라 생각하면 되겠네요. 답변 감사합니다.
네 이게 프레임이면
브라우저 보안때문에
CORS 등 충돌이 나는 경우가 있고
모바일에서는 새션 유실 등 결제 실패 이슈가 있습니다.