결제 하려고 하는데 아무 창이 안뜨네요. 어더헥 해야 할까요?
https://en.ciameet.me/register/regi_form.php 페이지에서 결제를 하려고 합니다. 토스페이먼트 승인 받고 api 테스트 키에서 실제 연동키를 받아서 결제를 진행하려고 하는데 연동키를 입력하면 결제창이 안열리는데 어떻게 해야 할까요?
CIA톡톡화상영어 1:1영어관리
최정예 강사님의 1:1영어회화. 10년이상 경력자의 1:1매니지먼트로 높은 퀄리티
16 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
개발자 이신거죠?
네 맞습니다.
결제연동은 하신건가요?
연동키는 어디에 입력하신 건가요?
<button id="payment-button" class="btn btn-default">Payment</button>
<script>
const clientKey = "live_ck_6bJXmgo28e7PYPNvpNnYVLAnGKWx";
const customerKey = "CkJVpP4JAgKI1-ClZUTU11"; // 내 상점에서 고객을 구분하기 위해 발급한 고객의 고유 ID
const button = document.getElementById("payment-button");
// ------ 결제위젯 초기화 ------
// 비회원 결제에는 customerKey 대신 ANONYMOUS를 사용하세요.
const paymentWidget = PaymentWidget(clientKey, customerKey); // 회원 결제
// const paymentWidget = PaymentWidget(clientKey, PaymentWidget.ANONYMOUS) // 비회원 결제
// ------ 결제 UI 렌더링 ------
// 결제위젯 UI를 렌더링할 위치를 지정합니다.
#payment-method와 같은 CSS 선택자와 결제 금액 객체를 추가하세요.
// 해외 결제에는 currency, country 정보가 필수입니다.
// https://docs.tosspayments.com/sdk/widget-js#renderpaymentmethods선택자-결제-금액-옵션
paymentWidget.renderPaymentMethods(
"#payment-method",
{
value: 664.98,
currency: "USD", // USD 통화만 지원
country: "US", // ISO-3166의 두 자리 국가 코드 모두 지원
},
// 렌더링하고 싶은 결제 UI의 variantKey
// 아래 variantKey는 문서용 테스트키와 연동되어 있습니다. 멀티 UI를 직접 만들고 싶다면 계약이 필요해요.
// https://docs.tosspayments.com/guides/payment-widget/admin#멀티-결제-ui
{ variantKey: "PAYPAL" } // PayPal이 추가된 결제 UI의 variantKey
);
// ------ 이용약관 UI 렌더링 ------
// 이용약관 UI를 렌더링할 위치를 지정합니다. #agree와 같은 CSS 선택자를 추가하세요.
// https://docs.tosspayments.com/sdk/widget-js#renderagreement선택자-옵션
paymentWidget.renderAgreement(
"#agreement",
{ variantKey: "AGREEMENT-EN" } // 영문 이용약관 UI 렌더링
);
// ------ '결제하기' 버튼 누르면 결제창 띄우기 ------결제위젯 JavaScript SDK | 토스페이먼츠 개발자센터
결제위젯 JavaScript SDK를 추가하고 메서드를 사용하는 방법을 알아봅니다.
결제위젯 어드민 사용하기 | 토스페이먼츠 개발자센터
토스페이먼츠와 계약을 완료했으면 어드민에서 결제 UI를 커스터마이징할 수 있어요.
샘플코드로 테스트 하고 코드만 바꿨어요.
PayPal 연동하기 | 토스페이먼츠 개발자센터
토스페이먼츠 결제위젯 SDK로 PayPal 해외 간편결제를 연동하는 가이드입니다. 결제위젯으로 간편하게 주문서 페이지의 결제 UI를 연동할 수 있기 때문에 해외 간편결제 연동에 추천하는 방법입니다.
여기 있는 것 보고 하신건가요?
아마 v1 보고 했을꺼예요.
PayPal 연동하기 | 토스페이먼츠 개발자센터
토스페이먼츠 결제위젯 SDK로 PayPal 해외 간편결제를 연동하는 가이드입니다. 결제위젯으로 간편하게 주문서 페이지의 결제 UI를 연동할 수 있기 때문에 해외 간편결제 연동에 추천하는 방법입니다.
이 이가이드 보면 설정하기 에 결제위젯 어드민과 개발자 센터 쪽 설정하는 부분과 키 확인하는 부분이 있습니다.
이부분 하셨는지 확인부탁드립니다.
그리고 결제위젯은 live_gck 로 시작하는 키를 쓰셔야 해요.
네 알겠습니다. v1 으로 했을때 말씀하시는거죠? 확인해보도록 하겠습니다.
이부분설정할때 variantkey 를 코드에서 보내주시는 방법으로 설정하셔야 합니다.
네 알겠습니다. 감사합니다!
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.