Stripe integration for Salesforce in lightning components

Question

We are trying to implement Stripe integration with Salesforce by using Lightning Components for payments.

Stripe use an API for securely obtain the users card information. This API is for the client, so we have to import it as a script. The problem is that Lightning doesn't allow script tags, so we downloaded the JavaScript file from Stripe and added to the org as a static resource, then we added it with the ltng:require tag, but Stripe does not allow to use their API from another domain than stripe.com, so it didn't worked.

Then we tried to add a script tag with the url inside an aura:unescapedHtml, and it didn't worked again because we got the error "aura_prod.js:16 Refused to connect to 'https://js.stripe.com/v2/' because it violates the following Content Security Policy directive: "connect-src 'self'", directive set in the head tag, and it cannot be modified.

We are using Stripe API V2 because V3 doesn't work in lightning components, and if it worked, it would have the same problem.

Is there a way to use an external script in a lightning component?

Answer 1

If you are open to process this information server side, then there are options. 1. you can create a token (which is identified as a token for card) using stripe token api And then create charge object in Apex using stripe Charge API in the backend. 2. There is also another server side option using Stripe Payment Intent API which is the latest api and it supports 3DSecure transactions. Since stripe documentation doesn't have SDK for APEX, that means you might have to go traditional way using direct API approach. Or if you can use middleware solution like host a java application using Stripe java sdk on heroku or some other cloud provider and call from Apex to that solution, that should work too. FYI: Both solution works in Lightning since it doesn't require you to download any JS from outside but you have to write some javascript, specially with Payment Intent API, since it has front end side interaction with end user.

You can checkout my payment intent API solution built in .net core : https://github.com/balindersingh/stripe-payments and demo . So you can get the idea how Payment Intent API can be implemented on backend side.

Answer 2

I asked in the partner community and basically you are out of lock trying to use a external script in a lightning component,

from salesforce:

Previous version of Lightning Container components allowed you to specify the CSP level, but we removed this functionality a few releases ago. The CSP level is now always set to high.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/container_limits.htm

We are working on providing CSP Trusted Site support for Lightning Container Components and hope to make it available in Summer '19 (safe harbor)

and:

Lightning Container Components do not currently allow you to call out to external endpoints. We plan to add support similar to what is available to Lightning components in our Summer '19 release. Note that this still will not allow you to bring in external JavaScript. Doing so would introduce a potential security vulnerability.

For now, the only way you can bring in externally hosted JS is to do it in a Visualforce page.

So, I guess your only option would be to work with a Canvas App which you can use inside a Lightning Component.

Answer 3

You can implement the stripe payment gateway using REST APIs. You can call them via APEX callout and handle the response accordingly.

It will not require you to use any JS. You need to build you own UI for capture card informations.

https://stripe.com/docs/api/charges/object?lang=php