This repo is for accepting payments from customers using PayPal.

This code is specific to Google Apps Script.

This solution uses both the client side PayPal Javascript SDK and the server side PayPal REST API to accept a payment from the buyer.

This server code is specific to Apps Script, and the server call from the client side is also specific to Apps Script.

Much of the information needed is in the comments of the code.

NOTE: To go "live" you must:

• Remove the word sandbox from the urls - See: https://developer.paypal.com/docs/paypal-plus/germany/integrate/test-and-go-live/#go-live
• Use different client and secret credentials

In-App PayPal system with server integration

Basic Requirements:

• These are general requirements. It’s main purpose is to give you an understanding of the basic parts of the system. You need to understand a general outline in order to know how to put the major pieces together.
• A main HTML file for your Web Page, dialog box or sidebar.
  • If you have separate files for CSS styling and JavaScript code then you’ll have other files also.
• Script tag for the PayPal client side SDK
  • with <script src="https://www.paypal.com/sdk/js?client-id= xxxx loads the PayPal client side SDK with your client ID HTML DIV tag with the id attribute of “#paypal-button-container”
• Client side code that triggers the PayPal SDK to create the PayPal buttons, and handle the order creation and approval. Server side code for making requests to PayPal. Obviously, you need a PayPal account, and you need to create credentials for the authorization.

Program Flow

• HTML loads with your payment system html
  • Script tag with <script src="https://www.paypal.com/sdk/js?client-id= xxxx loads the PayPal client side SDK with your client ID
    • The script tag must be in the tag of the HTML that is opened
    • In my system the client id is looked up on the server using a scriptlet. So there needs to be a function in a “gs” file with settings
• When the HTML loads, some client side code also runs at the same time and the PayPal buttons are initialized and created. You can have multiple different types of PayPal buttons that are for different payment types. For example, “PayPal Pay later” and “Debit or Credit Card.” So, the user has choices about how to pay.
• The PayPal SDK creates buttons that are rendered into an html tag with the id attribute of “#paypal-button-container”
• The code for the PayPal button initialization should be placed at the bottom to make sure that it only runs after the html tag with the id attribute of “#paypal-button-container” is loaded
• For my payment system, the user has the choice to pay with either stripe or PayPal, and so the user doesn’t see all the buttons initially. If the user chooses PayPal, then my code shows the PayPal buttons that were generated by the PayPal SDK.
• User clicks a PayPal button generated by the PayPal client side SDK.
• The button opens a small browser window that overlays the current content, for an In-App type of payment system.
• The user pays.
• The “createOrder” client side method calls the server code to complete the payment transaction. This both creates and executes the transaction.
• The “onApprove” client side method runs and displays a message to the user that the transaction was successful.
• Your server code can save customer information to your customer database.
• Client side handlers for canceling and errors will need your custom code.

Information

The information given here is for a payment system that uses both the PayPal javascript SDK AND server side PayPal API calls.
This PayPal payment system uses Smart Payment Buttons - See: https://developer.paypal.com/docs/checkout/

• The two most important documentation links are:
  • https://developer.paypal.com/docs/checkout/integrate/
  • https://developer.paypal.com/docs/checkout/reference/server-integration/set-up-transaction/

For configuration settings there is information at: https://developer.paypal.com/docs/business/javascript-sdk/javascript-sdk-reference/

Note that this PayPal implementation does NOT require there to be a button definition in your online PayPal settings in your PayPal account - That doesn’t mean that there are button settings, but it’s put into your code.

PayPal has multiple different ways to set up a payment system, from basic to custom. Trying to create a generic example that would be generally usable would be difficult.

The PayPal JavaScript client side SDK that I am using is newer than the checkout.js system.

For an overview of the PayPal checkout with server integration - See this Link: https://developer.paypal.com/docs/archive/checkout/how-to/server-integration/

It is very important to understand the "sandbox" and the "production" settings.
There are multiple settings that must all be for either "sandbox" or "production" If you mix "sandbox" and "production" credentials and API links then your code will not work and the error messages may not help you to understand what the real problem is -

Anything to do with "sandbox" is for testing purposes.
"production" is for accepting live payments from customers.

The terminology that PayPal uses for the credentials is:

• client id - The client side credential key
• secret - The server side credential key

Credentials need to be in three different settings-

1. Client side script tag - client id
2. Server side variable - client id
3. Server side variable - secret

To test your PayPal code you must do multiple things:

1. Create sandbox (test) client and secret credentials
2. Use a special buyer PayPal account: https://developer.paypal.com/docs/checkout/integrate/

I think that there are advantages of using both the client side PayPal SDK to create the PayPal buttons, and the server side integration to complete the transaction. Your Apps Script server code can inform you of a payment, or log an error, and of course server side code is not accessible to the browser.