API 키 연동 문의
안녕하세요. 문의사항이 크게 2가지가 있어 글남깁니다.
1. 개발연동테스트 상점으로 개발 및 테스트가 완료되어 계약되어있는 고객사 토스 페이먼츠 개발자센터에서 좌측 상단 상점 selectbox에서 실제 연결할 상점 선택 후 나오는 테스트, 라이브 키를 가지고 소스에 넣었으나 스크립트 에러로 존재하지 않는 상점 정보라고 나옵니다. 실제 계약이 이루어진 상황으로 알고있는데 이런 경우 어떤 경우 인가요?
2. 결제위젯 연동 키를 이용하여 개발연동테스트를 진행했는데요.
결제 위젯 연동키는 사업자당 1개라고 하는데요.
지금 현재 1번에 말씀드린바와 같이 이미 계약이 되어있고 다른 사이트에서 결제된 내역이 다수 존재함니다. 결제내역을 보니 상점아이디(MID)가 있던데... 제가 MID를 선택 할 수 없는게 정상인가요?
자동 결제•API 연동키는 상점 아이디 마다 키값이 주어지는것 같던데....
이해가 잘 안되네요
37 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
mid가 어떻게 되세요?
제가 연결하려고하는 MID입니다
결제위젯하시려는걸까요?
네 맞습니다
2번 질문에 대해서 답은 드릴 숭 ㅣㅆ을 것 같요

1번 질문은 정확히 어떤 상황ㅇ에서 발생하시나요?
위젯 띄울때
발생합니다...
tossPayments.requestPayment
실행시 발생합니다
아니면 혹시 제가 개발 로컬 환경에서 키값 바꿔서 테스트 중인데 결제위젯 띄울때 ip나 도메인으로 차단하는게 잇나요?
제 로컬 환경에서 키값 바꿔서 테스트 하고 이상없을때 통합 개발 서버 및 운영 서버에 올리려했습니다.
결제 위젯이 차단하는 것은 없습니다.
지금 위젯 render할 때 사용한 clientKey는 어떤거 쓰셨나요?
선생님이 캡쳐해주신
결제위젯 연동 키(테스트)
클라이언트키 썻습니다
마지막에 클론 빼고요
variantKey는 어떻게 쓰셨어요?
방금 말씀하신 키는
따로 설정한게 없습니다
혹시 그건 어떤걸까요?
우선 귀사 키에 혹시라도 이상이 있는지 바로 확인해보고 이상없으면 이어서 가이드드릴게요
네 감사합니다
찾아보니 해외결제 관련 키인거 같은데 제가 적용하는 프로세스에는 필요없는 것같습니다... 참고부탁드려요

귀사 키에는 문제가 없습니다.
variantKey설명드릴게요
위젯은 여러 MID로 여러 UI를 만들수 있습니다. 이는 variantKey로 구분되고요
위젯키가 어떤 UI를 불러올지 알아야하기 때문에, variantKey를 보내주셔야 위젯이 정상 render됩니다.
결제위젯 연동하기 | 토스페이먼츠 개발자센터
토스페이먼츠 결제위젯 연동 가이드입니다. 내 상점의 주문서 페이지에 최적의 주문서 UI를 연동하세요. 결제 연동하기 가장 편리한 로우코드(Low-code) 솔루션입니다.
자세한건 여기 참고바랍니다.
선생님 그러면 제가 맞게 이해했는지 확인좀 부탁드릴께요.
결제위젯 연동키를 사용 시 사업자당 1개의 키만 발급되니, 특정 MID로만 관리를 하고싶으면 올려주신 결제 UI 설정에 들어가서 variantKey를 생성 후 위젯 렌더링 할때 셋팅해주면 된다.
제거 이해한게 맞을까요...?
네
지금 보니 아까 말씀 드린 MID로 VariantKey로 설정되오잇네요
그럼 위젯띄울때 옵션 값만 주면 되겟군요
한가지만 더 여쭤보겠습니다.
variantKey를 쓰러면 꼭 PaymentWidget(client, customerkey) 리턴 객체에서만 사용 가능한가요?
저는 TossPayment(client) 함수를 써서 나온 객체로 requestPayment('CARD',function(){})를 쓰고있거든요
제가 쓰고있는 객체 안에는 renderPaymentMethods가 없습니다...
그럼 결제위젯이 아니라
결제창으로 연동하고 계시나요?


2개중 어떤걸 사용하고 싶으신지 먼저 알려주세요
아 네 결제 창인것 같습니다. 제가 아까 잘못말씀드린것같네요

이렇게 버튼 클릭하면
파라미터에 CARD, TRANSFER
인자값을 강제로 주고있슴니다
버튼 각각 이벤트 걸어서요
결제 수단 선택을 저희가 커스텀 마이징해서 버튼을 만들고 각각에 맞는 결제창의 띄우는 방식으로 구현했습니다
그럼
위젯키 사용하지마시고
보내주신 양식은.... 결제 UI 위젯에서 직접 만들수 있는 거같네요
그밑에 자동결제 쪽에 있는 키사용하셔야하는데요
거기에
selectbox가 있어서
Mid별로 키 확인이 가능합니다.
문서는 위에 참고하시기 발반디ㅏㅣ
자동결제•API 연동 키 이걸 사용 해야한다는거죠?
자동결제를 하지 않을거지만
이 키를 사용해도 무방한건가요?
지금 제가 구현한 케이스는요...?
설명에는 자동결제 지급대행 부가서비스를 연동할때 그 키를 쓰라고 되어있어서요....
위에 설명이 취약해서 그부분은 수정될 예정입니다.
우선 말씀드린대로 해당 킷 ㅏ용해주세요
네 알겠습니다.
알려주신대로 처리하니 운영 상점 테스트 결제내역으로 처리되는 내용까지 모두 확인했습니다.
빠른 가이드 감사드립니다. 🙂
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.