Toss payments 개발자 커뮤니티Tp개커Toss payments 개발자 커뮤니티
Powered by
Mingi ChoeM
Toss payments 개발자 커뮤니티•2y ago•
12 replies
Mingi Choe

인스타그램 인앱 브라우저에서 몇 유저에게 결제 수단 선택 에러 발생

간혹가다 첨부해드린 영상처럼 결제수단 선택해달라는 에러가 발생하고 있습니다.
환경은 현재 인스타그램 인앱브라우저에서 확인되고 있으며, PC에서는 아직 재현된 건은 없습니다.

현재 구현되어있는 토스페이먼츠 위젯 로직은 아래와 같습니다

  const [isWidgetReady, setIsWidgetReady] = useState<boolean>(true);

  /** 토스페이먼츠 위젯 추가 */
  useEffect(() => {
    if (paymentWidget == null) return;

    const paymentMethodsWidget = paymentWidget.renderPaymentMethods(
      '#payment-widget',
      { value: orderPriceSummary.totalCost },
      { variantKey: 'DEFAULT' },
    );

    paymentMethodsWidget?.on('ready', () => {
      paymentMethodsWidgetRef.current = paymentMethodsWidget;
      setIsWidgetReady(false);
    });
  }, [paymentWidget]);

  /** 토스페이먼츠 결제 금액 반영(orderPriceSummary 변경 시 자동으로 값 적용) */
  useEffect(() => {
    const paymentMethodsWidget = paymentMethodsWidgetRef.current;
    if (paymentMethodsWidget == null) return;

    paymentMethodsWidget.updateAmount(orderPriceSummary.totalCost);
  }, [orderPriceSummary.totalCost, paymentMethodsWidgetRef.current]);

...

<Button
  className="mb-12"
  type="primary"
  fullWidth
  size="large"
  loading={submitting || isWidgetReady}
  onClick={결제하기}
  disabled={!결제가능상태()}
>

...
  const [isWidgetReady, setIsWidgetReady] = useState<boolean>(true);

  /** 토스페이먼츠 위젯 추가 */
  useEffect(() => {
    if (paymentWidget == null) return;

    const paymentMethodsWidget = paymentWidget.renderPaymentMethods(
      '#payment-widget',
      { value: orderPriceSummary.totalCost },
      { variantKey: 'DEFAULT' },
    );

    paymentMethodsWidget?.on('ready', () => {
      paymentMethodsWidgetRef.current = paymentMethodsWidget;
      setIsWidgetReady(false);
    });
  }, [paymentWidget]);

  /** 토스페이먼츠 결제 금액 반영(orderPriceSummary 변경 시 자동으로 값 적용) */
  useEffect(() => {
    const paymentMethodsWidget = paymentMethodsWidgetRef.current;
    if (paymentMethodsWidget == null) return;

    paymentMethodsWidget.updateAmount(orderPriceSummary.totalCost);
  }, [orderPriceSummary.totalCost, paymentMethodsWidgetRef.current]);

...

<Button
  className="mb-12"
  type="primary"
  fullWidth
  size="large"
  loading={submitting || isWidgetReady}
  onClick={결제하기}
  disabled={!결제가능상태()}
>

...


저희 측에서는 토스페이먼츠 측으로 들어가는 에러 확인이 어려워 이 부분 체크한번 부탁드리겠습니다.

상점 MID :
eibijeaz5f
eibijeaz5f

위 이슈 재현되고 있는 customer_key :
d5d4cd07616a542891b7ec2d0257b3a24b69856e
d5d4cd07616a542891b7ec2d0257b3a24b69856e
Toss payments 개발자 커뮤니티 banner
Toss payments 개발자 커뮤니티Join
Toss payments 개발자 커뮤니티입니다. 결제 연동하며 겪는 기술 문의부터, 결제 시장에 대한 다양한 정보까지 얻어가세요~
15,588Members
Resources
Recent Announcements

Similar Threads

Was this page helpful?

Similar Threads

결제 수단 선택 후 에러
구구구구구 / ❓┃연동개발-문의
2y ago
인스타그램 인앱 결제 오류
은빛질주은은빛질주 / ❓┃연동개발-문의
16mo ago
인스타그램 인앱 결제 오류
핫재핫핫재 / ❓┃연동개발-문의
16mo ago
인스타그램 인앱 결제 안되는 현상..
doeDdoe / ❓┃연동개발-문의
16mo ago