CODEWITHSUNDEEP
reactjsreact-nativestripe-payments
midnighttfoxx
midnighttfoxx

Reputation: 41

How to get the "Save Card Details" option from stripe's paymentSheet?

I am using stripe payment sheet to pay in my app, but for some reason the payment sheet does not have the "save card details" option as it does in this image. The code below works for generating the payment sheet, but there is no option to (1) select previously stored cards or (2) to store the new card they input with the checkbox at the bottom.

try {
  // send payment request to server
  const response = await fetch('[redacted]/payment', {
      method: 'POST',
      headers: {
          'Content-Type': 'application/json'
      },
      body: JSON.stringify({
          amount,
          name: 'Test User',
          email: '[email protected]',
          phone: '1234567890',
          
      }),
  });
  const data = await response.json();
  if(!response.ok) return Alert.alert('Something went wrong', data.message);

  const {clientSecret, success, message, ephemeralKey, ret_error, customer} = data;
  console.log("client secret:", clientSecret);
  console.log("success:", success);
  console.log("message:", message);
  console.log("ephemeralKey:", ephemeralKey);
  console.log("error:", ret_error);
  console.log("customer:", customer);
 

  const { init_error } = await initPaymentSheet({
      customerId: customer,
      customerEphemeralKeySecret: ephemeralKey,
      paymentIntentClientSecret: clientSecret,
      customFlow: false,
      merchantDisplayName: '[redacted]',
      style: 'automatic',
      
      
  });

  if (init_error) {
  console.error(init_error);
  return Alert.alert(init_error.message);
  }

  const { present_error } = await presentPaymentSheet();
  if (!present_error) {
  //Alert.alert('Success', 'The payment was confirmed successfully');
  // fullfill order (TODO: transfer electricity)
  } else if (present_error.error.code === PaymentSheetError.Failed) {
  Alert.alert(
      `PaymentSheet present failed with error code: ${present_error.error.code}`,
      present_error.error.message
  );
  } else if (present_error.error.code === PaymentSheetError.Canceled) {
  Alert.alert(
      `PaymentSheet present was canceled with code: ${present_error.error.code}`,
      present_error.error.message
  );
  }
}
  catch (error) {
      Alert.alert('Error', error.message);
  }

Upvotes: 2

Views: 1254

Answers (1)

orakaro
orakaro

Reputation: 1971

When you create the PaymentIntent on server-side, make sure to not specify setup_future_usage to make this option appear on PaymentSheet.

Stripe iOS SDK documented it in their CHANGELOG.

Upvotes: 2

Related Questions