박페이먼츠 위젯 불러오기 안됨
next.js 로 페이먼츠 위젯을 불러오는 기능을 작동시키려고 하는데 콘솔에 error가 생기면서 위젯이 생성되지 않습니다. 코드는 아래와 같습니다.
useEffect(() => {
const setToss = async () => {
const clientKey = process.env
.NEXT_PUBLIC_TOSS_PAYMENTS_CLIENT_KEY as string;
const customerKey = myDatabaseId;
const paymentWidget = await loadPaymentWidget(
clientKey,
customerKey,
);
// 결제방법 UI
const paymentMethodWidget = paymentWidget.renderPaymentMethods(
'#payment-widget',
{ value: finalPrice, currency: 'KRW', country: 'KR' },
);
// 이용약관 동의 UI
paymentWidget.renderAgreement('#agreement');
paymentWidgetRef.current = paymentWidget;
paymentMethodWidgetRef.current = paymentMethodWidget;
console.log('widjet activated');
};
if (myDatabaseId != (null || undefined)) {
setToss();
}
}, []);
콘솔에서 확인되는 오류 화면도 첨부합니다. 문제가 무엇일까요?
useEffect(() => {
const setToss = async () => {
const clientKey = process.env
.NEXT_PUBLIC_TOSS_PAYMENTS_CLIENT_KEY as string;
const customerKey = myDatabaseId;
const paymentWidget = await loadPaymentWidget(
clientKey,
customerKey,
);
// 결제방법 UI
const paymentMethodWidget = paymentWidget.renderPaymentMethods(
'#payment-widget',
{ value: finalPrice, currency: 'KRW', country: 'KR' },
);
// 이용약관 동의 UI
paymentWidget.renderAgreement('#agreement');
paymentWidgetRef.current = paymentWidget;
paymentMethodWidgetRef.current = paymentMethodWidget;
console.log('widjet activated');
};
if (myDatabaseId != (null || undefined)) {
setToss();
}
}, []);
콘솔에서 확인되는 오류 화면도 첨부합니다. 문제가 무엇일까요?
