[RN] iOS 인앱 결제 추가하기

[iOS]
- ruby: 2.7.8
- cocoapods: 1.15.2

[JS]
- react-native: 0.73.6
- react-native-iap: `12.13.0`

import {
  IapIosSk2,
  initConnection,
  ProductPurchase,
  requestPurchase,
  setup,
  useIAP,
  withIAPContext,
} from 'react-native-iap';

const ITEM_SKUS = [
  'new.item1',
  'new.item2',
  'new.item3',
  'new.item4',
  'phg_item',
  'phg_item2',
  'phg_item3',
  'green_item',
];

function App(): React.JSX.Element {
  const { products, getProducts, finishTransaction, currentPurchase } = useIAP();

  const buy = async (sku: string) => {
    try {
      const result = await requestPurchase({
        sku,
        andDangerouslyFinishTransactionAutomaticallyIOS: false, // requestPurchase 호출 후 자동으로 finishTransaction을 호출할지 여부
      });
      console.log(result);
    } catch (err) {
      console.error(err);
    }
  };

  const refund = async (sku: string) => {
    try {
      const result = await IapIosSk2.beginRefundRequest(sku); // 반환값: 'success' | 'userCancelled'
      console.log(result);
    } catch (err) {
      console.error(err);
    }
  };

  useEffect(() => {
    (async () => {
      // 결제 API로 StoreKit 2를 사용 (인앱 환불 기능을 사용하기 위함)
      setup({storekitMode: 'STOREKIT2_MODE'});

      await initConnection();
      await getProducts({skus: ITEM_SKUS});
    })();
  }, [getProducts]);

  useEffect(() => {
    const checkCurrentPurchase = async (
      purchase: ProductPurchase,
    ): Promise<void> => {
      if (purchase) {
        try {
          console.log(JSON.stringify(purchase, null, 2));
          const ackResult = await finishTransaction({purchase});
          // andDangerouslyFinishTransactionAutomaticallyIOS 값이 false이기 때문에,
          // requestPurchase 호출 후 finishTransaction을 수동으로 호출해야만 결제가 완료된다.
          console.log(JSON.stringify(ackResult, null, 2));
        } catch (err) {
          console.error(err);
        }
      }
    };

    if (currentPurchase) {
      checkCurrentPurchase(currentPurchase);
    }
  }, [currentPurchase, finishTransaction]);

  // 상품 정보 확인
  console.log(JSON.stringify(products, null, 2));

  return (
    <SafeAreaView>
      <StatusBar />
      <FlatList
        data={ITEM_SKUS}
        keyExtractor={item => item}
        renderItem={({item: sku}) => (
          <View>
            <Button title={`${sku} 구매하기`} onPress={() => buy(sku)} />
            <Button title={`${sku} 환불하기`} onPress={() => refund(sku)} />
          </View>
        )}
      />
    </SafeAreaView>
  );
}

export default withIAPContext(App);

 [
  {
    "title": "new.item1",
    "productId": "new.item1",
    "description": "",
    "type": "iap",
    "price": "1100",
    "localizedPrice": "￦1,100",
    "currency": "KRW"
  },
  {
    "title": "new.item2",
    "productId": "new.item2",
    "description": "",
    "type": "iap",
    "price": "3300",
    "localizedPrice": "￦3,300",
    "currency": "KRW"
  },
  ...
  {
    "title": "phg_item",
    "productId": "phg_item",
    "description": "",
    "type": "iap",
    "price": "4400",
    "localizedPrice": "￦4,400",
    "currency": "KRW"
  }
]

{
  "productId": "new.item1",
  "transactionId": "2000000556433469",
  "transactionDate": 1711527550206,
  "transactionReceipt": "",
  "purchaseToken": "",
  "quantityIOS": 1,
  "originalTransactionDateIOS": 1711527550206,
  "originalTransactionIdentifierIOS": 2000000556433469,
  "verificationResultIOS": "eyJhb...qoUPmfQ",
  "appAccountToken": "",
  "transactionReasonIOS": "PURCHASE"
}