Enable Apple Pay using Stripe library

Ionic Framework
1

I need to enable apple pay to my ionic cordova app. I integrated stripe javascript library and I can complete payment using standard credit card. I can’t see apple pay button.

I already configured apple merchant and enabled it from xcode

my code:

this.stripe = Stripe(this.strpPubKey);
 const options = {
      clientSecret: this.secredGeneratedByServer,
      appearance: { theme: 'flat' }
    };
const elements = this.stripe.elements(options);
this.card = elements.create('payment');

this.card.mount('#card-element');

this.card.addEventListener('change', event => {
      
      console.debug("[CheckoutPayment] listner ");

      var displayError = document.getElementById('card-errors');
      if (event.error) {
        displayError.textContent = event.error.message;
      } else {
        displayError.textContent = '';
      }
    });

    var form = document.getElementById('payment-form');
    form.addEventListener('submit', event => {
      event.preventDefault();
      console.log(event)

      me.buttonDisabled = true;

      this.stripe.confirmPayment({
        elements,
        capture_method: 'manual',
        confirmParams: {
          return_url: '',
          payment_method_data: {
            billing_details: {
              'name': this.cardHolder
            }
          }
        },
        redirect: 'if_required'
      }).then(function (result) {

        console.debug("[CheckoutPayment] result ", result);

        me.paymentResult = result;

        if (result.error) {

          if (result.error.type == 'validation_error') {
            me.buttonDisabled = false;
          } else {
            // Show error to your customer (e.g., insufficient funds)
            //alert(result.error.message);
            me.goToError();
            me.buttonDisabled = false;
          }
        } else {
          if (result.paymentIntent.status === 'succeeded' || result.paymentIntent.status === 'requires_capture') {
            me.goToConfirm();
          }
        }
      });
2

The docs state what you need to do. All you need to do is READ: Enable Apple Pay on your Stripe account : Stripe: Help & Support.

1 Like
3

@Hills90210 thanks for your support. I already read the official documentation several times but I can’t solve my issue.

I don’t user third part plugin but I used simple official js library provided by stripe js.stripe.com/v3. Is it a problem? Why I used it? Because I had need to set manual capture and cordova plugin was limited.

Now I’d like to integrate other plugin but It is very old and not maintened. I’m worried.

I completed all tasks:

  • create certificate on Apple Developer Program
  • configured my Stripe account (infact if I use WebCheckout on my website, apple pay works!)

My problem is enable apple pay button in the app

Alternative solution is migrate to capacitor and use updated plugin but it is more complex and require more effort

if you can help me I’m very grateful

Thanks