iOS Code Snippet [B4X] [B4XPages] STRIPE Checkout - Credit card and Apple Pay

Attached a project which demonstrates how to accept a STRIPE Payment within your app. It is based on the information on this page: https://stripe.com/docs/checkout/integration-builder

On iOS it also allows the use of APPLE PAY.

Unfortunately, Google Pay does not seem to work for me, not sure why. If anyone can work that out, please let me know.

Please forgive the naming convention, it originally was a test for APPLE PAY, but then through the power of B4XPAGES, I realized it will work with ANDROID with only minor tweaks.

It uses a Webview to display the a Standard STRIPE Checkout screen.

PREREQUISITES:
  1. You need you own stripe keys: https://Stripe.com
  2. replace the lines with your own keys
    Stripe Keys:
    #if StoreRelease
    StripeAPIKey = "pk_LIVE_XXXX"
    StripeOtherKey = "sk_LIVE_XXXX"
    
    #else
    StripeAPIKey = "pk_test_XXXX"
    StripeOtherKey = "sk_test_XXXX"
    #end if
        #End If
  3. If you are using the B4A code you need to put the keys in the manifest file.
  4. For iOS you will need to change the Certificate and Provisionfiles

In a real app, you will need to setup your products, the doSession() function has a product hardcoded.

You will also need to handle the Success and Cancel results.

B4X:
Sub wvApple_OverrideUrl (Url As String) As Boolean
    Log($"Override ? (${Url})"$)
    If (Url.Contains("cancel.html")) Then
        wvApple.Visible = False
        xui.MsgboxAsync("Cancelling. Do something ","Hi")
        'handle cancelling here
    else if (Url.contains("success.html")) Then
        wvApple.Visible = False
        xui.MsgboxAsync("Success! Do something ","Hi")
        'Handle success here
    End If  
    Return False
End Sub

The StripeClass is a subset of a much larger class which will handle credit card payments without a webview. Please message me if you would like to know more.


If you use this code, please consider donating,
 

Attachments

  • Project.zip
    13.4 KB · Views: 144

omarruben

Active Member
Licensed User
Question:

After loading and the payment page is shown, there is a small "back arrow", looks like it is coming from stripe
how to erase it or not allow to show?
 

Andrew (Digitwell)

Well-Known Member
Licensed User
That is correct. This is a cancel button. Normally your logo appears next to it. If you press it you should get the cancel URL being called.

There is no way to remove it.
 

james_sgp

Active Member
Licensed User
Hi, I`m trying your app...I copy and pasted my Publishable and Secret keys into the app. But I get an error when I try to compile:

B4X:
ResponseError. Reason: , Response: {
  "error": {
    "message": "Invalid API Key provided: null",
    "type": "invalid_request_error"
  }
}
return failure - {success=false, responsecode=401, data={error={
  "error": {
    "message": "Invalid API Key provided: null",
    "type": "invalid_request_error"
  }
}
}}

Can you advise on the problem?

James
 

Andrew (Digitwell)

Well-Known Member
Licensed User
Hi James,
That's very odd. I just downloaded the sample again tried it on Android and it works fine.

Are you using B4A or B4i?

If you are using B4a then the keys must be placed in the manifest.

I tried using invalid keys in the manifest and got the following error.

B4X:
initialising stripe
Call B4XPages.GetManager.LogEvents = True to enable logging B4XPages events.
** Activity (main) Resume **
*** Service (httputils2service) Create ***
** Service (httputils2service) Start **
ResponseError. Reason: , Response: {
  "error": {
    "message": "Invalid API Key provided: sk_test_**********************mCqq",
    "type": "invalid_request_error"
  }
}
return failure - {success=false, responsecode=401, data={error={
  "error": {
    "message": "Invalid API Key provided: sk_test_**********************mCqq",
    "type": "invalid_request_error"
  }
}
}}

Your keys seem to be Null.

Can you change the log line in StripeClass->initialise to

B4X:
    Log($"initialising stripe ${apikey} ${otherkey}"$)
 

james_sgp

Active Member
Licensed User
I got the class working well in one of my B4A apps, but was wondering can the class make a payment link. Meaning I can send someone an email with a link for payment or put a link in a PDF document for payment?
 

Andrew (Digitwell)

Well-Known Member
Licensed User
Not as it stands as the sessionHTML is created dynamically at run time.
You could save this to a server as a unique file and then send that link.

If you want a payment link, I would do all the work on the server from the start.
Stripe provide plenty of support for this scenario. See

https://stripe.com/docs/payments/checkout

and

I'm a php person, so I would create a php script that would accept the product information from the app and return a url which is the built checkout page.
 
Top