기존 일반 결제를 구현한 상태로 서비스중입니다. 자동결제 추가시 자동결제용 api 키를 따로 신청해야할까요?
테스트로 빌링을 만들고 이전에 적용한 일반 키를 적용하니 자동결제는 새로운키를 발급받아야한다고 나오긴합니다...
20 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
이미 발급받은 API 개별 연동 키는 하단에 자동결제(빌링)이 포함되어 있습니다.

<head>
<title>결제하기</title>
<meta charset="utf-8" />
<!-- 토스페이먼츠 결제창 SDK 추가 -->
<script src="https://js.tosspayments.com/v1/payment"></script>
</head>
<body>
<script>
// ------ 클라이언트 키로 객체 초기화 ------
var clientKey = "live_ck_XXXXXXXXX";
var tossPayments = TossPayments(clientKey);
tossPayments
.requestBillingAuth("카드", {
// 결제수단 파라미터 (자동결제는 카드만 지원합니다.)
// 결제 정보 파라미터
customerKey: 'JVk1YDzex_XXXXXXXXX', // 구매자 ID로 상점에서 만들어야 합니다. 빌링키와 매핑됩니다. 자세한 파라미터 설명은 파라미터 설명을 참고하세요: https://docs.tosspayments.com/sdk/payment-js#결제-정보-5
successUrl: "https://my-store.com/success", // 카드 등록에 성공하면 이동하는 페이지(직접 만들어주세요)
failUrl: "https://my-store.com/fail", // 카드 등록에 실패하면 이동하는 페이지(직접 만들어주세요)
})
.catch(function (error) {
if (error.code === "USER_CANCEL") {
// 구매자가 결제창을 닫았을 때 에러 처리
}
});
</script>
</body>
결제창 JavaScript SDK(Version 1) | 토스페이먼츠 개발자...
토스페이먼츠 결제창 JavaScript SDK 사용에 필요한 준비와 메서드 사용법, 결제 실패 및 에러 처리 방법을 알아봅니다.

위와 같이 샘플로 현재 운영중인 api 개별 연동 키를 적용하면 자동결제(빌링) 계약이 안되어있다고 확인됩니다. 별도로 신청해야하는걸까요?
그리고 웹뷰를 사용하여 네이티브에 구현하는 자동결제(빌링) 샘플은 따로 없을까요?
별도 신청 후 새 키값을 받아야 합니다
샘플은 없어요 그냥 웹뷰를 올리면되서요
별도의 처리가 전혀필요없습니다
네 감사합니다. 확인했습니다
혹시 자동결제(빌링) 계약을 신청하는동안 테스트 가능한 키를 받아 개발을 진행할수 있을까요? 토스에서 제공되는 테스트키로는 카드정보 이후 에러가 발생하는것으로 확인되었습니다.
빌링 문서쪽에 키가 적혀있지않던가요?
적혀있다면 그 키 쓰시면 되세요
// API 개별 테스트 연동 키
const clientKey = "test_ck_D5GePWvyJnrK0W0k6q8gLzN97Eoq";
const secretKey = "test_sk_zXLkKEypNArWmo50nX3lmeaxYG5R";
네 감사합니다. 아래 샘플로 테스트중에 위와 같은 clientKey는 위 안내대로 적용하였습니다. 카드 등록시 이쪽 url로 이동하고 https://payment-gateway-sandbox.tosspayments.com/billing/mobile?token=a209ad48b09d4b8982262b6033ddb3dac16965868aa8402a8cde2394ae0f4b2a>id=a250811mQhdq9rENtiJZewYwmrpYT1grtCseYxr&agreedTermIndex=0%2C1%2C2%2C3 아래 에러가 발생합니다.
오류 - "_app-714adb611545d8ec.js:29 Not allowed to load local resource: file:///billing_confirm.jsp?customerKey=test_customer_key&authKey=bln_azy0Wv7AyYM"
혹시 local에서 작업중에 "window.location.origin + path + "/billing_confirm.jsp" path에 해당 경로가 local인 경우 동작하지 않는걸까요? 그러면 payment billing 샘플에 있는 특정 언어 폴더를 저희쪽 웹 서버에 등록해야 하는 방식일까요? 결제 위젯과 같이 토스에서 웹 url이 제공되는 형태가 아닌걸까요?
현재 구현된 jsp.zip 파일을 공유합니다.
tomcat을 띄우고 localhost로 이용하세요
지금 file을 직접 여셨어요
아 네 확인 감사합니다. 그렇다면 위 샘플을 바탕으로 직접 개발하여 tomcat을 띄워 서비스를 해야하는걸로 이해하면 될까요?
예 톰캣이든 기타 was를 켜서
http/https로 접속해야만 합니다
파일 형태 (file://~)로는 작동이 안돼요
아 네네 일반결제와는 다르게 빌링쪽은 관련 파일들을 직접 적용하여 서버에 올려야하는군요. 이해했습니다. 이른시간부터 빠른 답변 감사합니다.
일반결제도 사실 was 서버에 올려야 정상작동을 보장하긴해요
왜냐면 백엔드에서 토스 서버와 통신부가 있기때문에 그렇습니다
아 그렇군요. 확인 감사합니다 !
카드 정보 입력 + 본인인증 관련 화면은 토스에서 제공하는걸로 예상됩니다만 혹시 2번째 이미지의 카드 등록, 삭제등의 기능 화면도 제공될까요? 없다면 등록된 카드 정보를 조회, 삭제하는 api가 있을까요?


참고로 위 화면은 저희쪽 구독 기능의 디자인 화면입니다.
토스는 카드입력하고 본인인증만 제공합니다
기타 디자인은 직접 구현해야합니다
그런데 정기결제 형식의 서비스룰 제공하시는게 맞나요?
네 맞습니다. 해당 기능을 활용해서 구독 기능을 제공하려고 합니다.
해결은 다 되신거죠?
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.