결제 연동 체험하기

토스페이먼츠의 간편한 결제 연동 과정을 한눈에 볼 수 있습니다. 각 단계별 설명과 함께 달라지는 UI와 코드를 확인해보세요.

1 결제창 실행 준비하기

토스페이먼츠 결제창은 JavaScript SDK의 requestPayment 메서드를 사용해서 띄울 수 있습니다.

메서드의 첫번째 파라미터 값으로 결제수단인 '카드'를, 두번째 파라미터에는 추가 주문정보를 객체 형태로 전달합니다.

'결제하기' 버튼을 눌러서 결제창을 실행해보세요.

<html>
<head>
<script src="https://js.tosspayments.com/v1"></script>
</head>
<body>
<script> var tossPayments = TossPayments('test_ck_OEP59LybZ8Bdv6A1JxkV6GYo7pRe') tossPayments.requestPayment('카드', { amount: 25000, orderId: '', orderName: '토스 티셔츠 외 2건', customerName: '김토스', successUrl: 'https://test.com/success', failUrl: 'https://test.com/fail', }) </script>
</body>
</html>

결제수단

총 주문금액25,000원
  • 더 궁금한 내용이 있나요?자주 묻는 질문
  • 코드 샘플을 참고하세요TossPayments GitHub
  • 기술지원이 필요한가요?디스코드 채팅|이메일 보내기