SCA-ready online donations with Charitable & Stripe

Charitable Stripe 1.4 comes out today and implements two new Stripe APIs designed to smoothly handle new Strong Customer Authentication (SCA) rules in Europe.

We strongly recommend updating to the latest version as soon as possible, particularly if you are based in Europe or accept donations from European donors.

How will Strong Customer Authentication affect online donations?

Strong Customer Authentication (SCA) is a new European requirement designed to improve the security of online payments. Where SCA applies, it will require the donor to provide a second form of authentication to confirm their payment.

Currently, most online transactions using Stripe require just a single form of authentication: the card number and CVC verification code. With SCA, an additional form of verification will be required in addition to this.

To provide this additional form of verification, Stripe is introducing support for 3D Secure 2, a revamped version of the original 3D Secure, which you may have used yourself as Visa Secure or Mastercard Identity Check.

3D Secure 2 is better at handling SCA requirements in a consistent way. When SCA is required for a particular donation, the 3D Secure modal will pop up for the donor to complete; their donation will not be processed until they have completed the 3D Secure check.

SCA will be effective from September 14, though it is likely to be gradually introduced as countries within the EU follow a phased introduction.

Let’s see how Charitable’s implementation works

Updating Charitable’s Stripe integration with SCA compatibility required implementing several new aspects of the Stripe payments API. While we’ll try to leave the technical details out of this as much as possible, there were some necessary visual adjustments which mean that the donation experience is a little different.

Welcoming the new Checkout

Stripe has created a revamped Checkout experience, and it’s a significant update. The old Checkout used a modal window, which would pop up as soon as you click to donate; the new Checkout redirects to a Stripe-hosted page where payment is completed and the 3D Secure check is handled, if necessary.

stripe-form-before-after | Charitable — Before and after. On the left, the old Stripe Checkout modal; on the right, the new, SCA-ready hosted Checkout payment page.

A slicker, more secure credit card field

For those who aren’t using Checkout, the credit card portion of the donation form will look a little different too.

Charitable now uses a credit card field hosted by Stripe itself (part of its Stripe Elements API), which combines the card number, CVC verification, expiry and, in some cases, the post/zip code fields into a single form field. Benefits of loading the credit card from Stripe’s servers include real-time validation of credit card details, improved security, and easier PCI compliance (since no sensitive data hits your website’s servers).

stripe-payment-field-before-after | Charitable — Spot the difference? The old credit card fields (left) have been replaced by a single Credit/Debit Card field, providing inline validation and improved security.

Under the hood, credit card payments are handled using Stripe’s Payment Intents API, which is an SCA-ready method for accepting payments.

Bonus feature: customize the statement descriptor

SCA-readiness is the focus of this release, but we also sneaked in a bonus feature. You can now customize the statement descriptor from the Stripe settings page in Charitable’s settings area.

Upgrade to SCA-readiness

If you are already using Charitable Stripe, you should see an option to update to the latest version in your WordPress dashboard. Be sure to set your license key if you have not already.

For those who have modified the default plugin behaviour using code, including code snippets provided by us through our support channel, we recommend reading the upgrade notes as some changes may affect you.