kanghyeji Comments - Toss payments 개발자 커뮤니티

kanghyeji

Posts Comments

TPToss payments 개발자 커뮤니티

•Created by kanghyeji on 7/26/2024 in #❓┃연동개발-문의

iOS에서 PaymentWidget이 카드사 선택 UI를 렌더링하지 못합니다.

네 일단 위 방법으로 대처하겠습니다. 추후 초기화 여부 state를 알 수 있는 등의 대응을 해주시면 좋을 것 같습니다!! 감사합니다!

14 replies

TPToss payments 개발자 커뮤니티

•Created by kanghyeji on 7/26/2024 in #❓┃연동개발-문의

iOS에서 PaymentWidget이 카드사 선택 UI를 렌더링하지 못합니다.

renderPaymentMethods 메서드 호출 부분을 setTimeout으로 딜레이 주니까 정상 동작 하긴 하네요..!

14 replies

TPToss payments 개발자 커뮤니티

•Created by kanghyeji on 7/26/2024 in #❓┃연동개발-문의

iOS에서 PaymentWidget이 카드사 선택 UI를 렌더링하지 못합니다.

import { PaymentWidgetProvider } from '@tosspayments/widget-sdk-react-native';
import { v4 as uuidv4 } from 'uuid';

useEffect(() => {
    if (authStore.userToken) {
      (async () => {
        try {
           // 11자리 숫자의 uuid 셋팅
          const userInformation = await verifyByToken();
          setTossCustomerKey(userInformation?.uuid);
        } catch (e: any) {
          // 실패 시 임의의 uuid 값 셋팅
          setTossCustomerKey(uuidv4());
        }
      })();
    }
  }
}, [...]);

return (
  <PaymentWidgetProvider
    clientKey={...}
    customerKey={tossCustomerKey}
  >
)

import { PaymentWidgetProvider } from '@tosspayments/widget-sdk-react-native';
import { v4 as uuidv4 } from 'uuid';

useEffect(() => {
    if (authStore.userToken) {
      (async () => {
        try {
           // 11자리 숫자의 uuid 셋팅
          const userInformation = await verifyByToken();
          setTossCustomerKey(userInformation?.uuid);
        } catch (e: any) {
          // 실패 시 임의의 uuid 값 셋팅
          setTossCustomerKey(uuidv4());
        }
      })();
    }
  }
}, [...]);

return (
  <PaymentWidgetProvider
    clientKey={...}
    customerKey={tossCustomerKey}
  >
)

14 replies

TPToss payments 개발자 커뮤니티

•Created by kanghyeji on 7/26/2024 in #❓┃연동개발-문의

iOS에서 PaymentWidget이 카드사 선택 UI를 렌더링하지 못합니다.

코드는 위와 같습니다만, widget을 다시 초기화하는 방법이 따로 있을까요??

14 replies

TPToss payments 개발자 커뮤니티

•Created by kanghyeji on 7/26/2024 in #❓┃연동개발-문의

iOS에서 PaymentWidget이 카드사 선택 UI를 렌더링하지 못합니다.

import { PaymentMethodWidget, usePaymentWidget } from '@tosspayments/widget-sdk-react-native';

const paymentWidgetControl = usePaymentWidget();

useEffect(()=>{
  paymentWidgetControl.renderPaymentMethods(
        'payment-methods',
        { value: paymentData?.totalCost || 0 },
        { variantKey: 'DEFAULT' },
      );
},[...])

return (
  ...
  <PaymentMethodWidget
    selector="payment-methods"
    ...
  />
)

import { PaymentMethodWidget, usePaymentWidget } from '@tosspayments/widget-sdk-react-native';

const paymentWidgetControl = usePaymentWidget();

useEffect(()=>{
  paymentWidgetControl.renderPaymentMethods(
        'payment-methods',
        { value: paymentData?.totalCost || 0 },
        { variantKey: 'DEFAULT' },
      );
},[...])

return (
  ...
  <PaymentMethodWidget
    selector="payment-methods"
    ...
  />
)