[Paid] PayPal Extension to add payment system in you app

[Black_Knight]

Extension Overview:

The "PayPal Extension By @Black_Knight " is your entry point for incorporating PayPal's strength into your App Inventor applications. With the help of this dynamic plugin, the PayPal API may be easily accessed by your apps. Its clever construction makes it simple to retrieve access tokens using client credentials, bringing up a plethora of options for creating payment features.

Blocks

Explanation :

Step 1: Set Up Your Project

1. Open MIT App Inventor and create a new project or open an existing one.

Step 2: Add Components

1. Drag and drop a "WebViewer" component from the "User Interface" section onto your screen.
2. Drag and drop the "Paypal" extension component onto the screen.

Step 3: Design Your User Interface

1. Arrange your components on the screen as you wish. You might want to add buttons or labels for user interaction.

Step 4: Blocks Setup

1. In the Blocks section, set up the logic to interact with the PayPal API using the extension and Web Viewer.
2. Set the ClientId and ClientSecret properties of the PayPal extension.
3. When the user performs an action (e.g., clicking a button), call the GetAccessToken function of the PayPal extension to obtain an access token.
4. In the AccessTokenObtained event, call the MakePayPalPayment function to initiate a payment and obtain the payment link (href).
5. In the PaymentInfoObtained event, parse the response and use the ExtractHrefFromLinks function to get the payment link.
6. Load the extracted payment link into the Web Viewer using the Go to URL block.

Step 5: Handle Web Viewer Page Loaded and Redirect URLs

1. Use the Web Viewer's PageLoaded event to detect when the PayPal payment page has loaded.
2. In the PageLoaded event, check the URL of the Web Viewer. If the URL matches the "cancel_url," it indicates a cancelled payment.
3. If the URL matches the "return_url," it indicates a successful payment. You can show a success message to the user in this case.
4. after successful payment you have to use the capture_amount block to capture your price

steps in one image :

##Tutorial video:

How to use PayPal as a payment system in your app in Mit App Inventor | Kodular | Android Builder

preview video:

Testers

Thanks to @Ruben_Pietrobelli who tested this Extension and confirm that is working fine with him
Preview image
successful payment in live mode

Extension:

You can buy it via PayPal it costs 12$ after your payment you will directed to the download URL of the Extension.

Log in to your PayPal account

© 2023 MrKoder. All rights reserved.

For inquiries, please contact: Mr koder

Visit our YouTube channel: Mr Koder's YouTube Channel

[TIMAI2]

Also see here:

Paypal simple-HTML

Hi, I've just create a simil html for Paypal. It's the modified original HTML of the "Smart Button". If you want other button, ask. Here's the tutorial Download the HTML file Go to "https://www.paypal.com/us/home" -------> Sign In/ Sign Up Sign in or create an account Once in the dashboard go to developer Go to "Get API Credentials" Choose Sandbox (testing) or Live ---> Create App Choose the name ---> Create App Copy the Client ID Open the HTML by notepad++ or visual studio code Put…

[Black_Knight]

@Black_Knight

Extension updated to include Test with sandbox in addition to Livemode

[Black_Knight]

Topic updated with new functions now extension working fine

[Pratham_Gokani]

Hey @Black_Knight, I had a question:

Can the user change the amount after the payment flow has been initiated?
If no then what is the purpose of the AmountCaptured block? If the amount is fixed already then why would we want to capture it again?

Lets say that I want to sell a service to a user for a specific fixed price, I will not want the user to edit it. Which is what led me to asking this question.

Thanks!

[Black_Knight]

@Pratham_Gokani

Can the user change the amount after the payment flow has been initiated?

No he cant but he has the option to pay them part by part .

@Pratham_Gokani

then what is the purpose of the AmountCaptured block? If the amount is fixed already then why would we want to capture it again?

the purpose of this block is just an authentication step that you run to send for PayPal to authenticate that you are the seller.
And this is their system I am not the creator of this system.

[Pratham_Gokani]

@Black_Knight

And this is their system

Oh okay I asked it since I did not see you use this block in your YouTube video. Thanks though!