3. 결제창 연결하기
이 단계에서는 구매자를 토스페이 결제창으로 보내요. 2단계에서 받은 checkoutPage URL로 구매자를 이동시키기만 하면, 결제 수단 선택부터 인증까지 토스가 알아서 진행해요.
checkoutPage로 이동시키기
결제 생성 응답으로 받은 checkoutPage는 다음과 같은 형태예요. 결제마다 다른 URL이 발급돼요.
https://pay.toss.im/payfront/auth?payToken=example-payToken구매자의 브라우저를 이 URL로 리다이렉트하세요. 이때 두 가지를 주의해야 해요.
checkoutPage를 iframe으로 열지 마세요. iframe 안에서 checkoutPage를 로드하면 구매자 인증 후에 retUrl로
리다이렉트되지 않아서 결제 승인이 안 될 수 있어요. 반드시 페이지 전체를 이동시키세요.
Android 앱의 WebView에서 여는 경우 shouldOverrideUrlLoading을 확인하세요. 이 메서드가 모든 경우에 true를
반환하면 WebView에서 retUrl로 리다이렉트되지 않아 결제 승인이 안 돼요. retUrl로의 이동이 정상 동작하도록
구현해야 해요. 다음 문서를 참고하세요.
- shouldOverrideUrlLoading 문서
- shouldOverrideUrlLoading 가이드
구매자의 결제 진행 과정 이해하기
구매자는 결제창에서 결제 수단을 선택하고 인증을 진행해요. 이 구간은 토스 앱과 토스 서버가 통신하는 구간이라 가맹점이 처리할 일은 없지만, 구매자가 어떤 화면을 보는지 알아두면 문의 대응에 도움이 돼요.
- 토스 회원은 결제 수단을 선택하고 토스 비밀번호를 입력하면 인증이 완료돼요.
- 토스 비회원은 토스 앱을 설치하고 가입한 뒤 결제를 진행해요.
토스머니를 선택하면 계좌 유효성 검증과 충전 단계를 거치고, 카드 결제를 선택하면 카드 소유자 확인 후 카드 추가부터 진행할 수 있어요.
토스페이는 앱 결제 방식을 지원해요. PC 웹 브라우저에서 결제하는 경우 구매자의 휴대폰으로 결제 푸시 알림을 보내고, 인증은 토스 앱에서 진행해요. 결제 보안을 위해 웹 키보드 방식의 웹 결제는 제공하지 않아요.
테스트 결제도 같은 방식으로 인증해요. 테스트용 API Key로 생성한 결제도 본인 휴대폰의 토스 앱으로 인증하면 돼요. 실제 출금 없이 인증부터 승인까지 실거래와 동일하게 진행돼요.
다음 단계
구매자가 인증을 마치면 토스가 구매자를 retUrl로 돌려보내요. 4. 인증 결과 처리하기에서 이 결과를 처리해요.