Developers

Apple Pay & Google Pay Integration

The myPOS Embedded SDK allows you to add Apple Pay and Google Pay buttons directly on your website. This page will provide information on how you can set this up.

Why Apple Pay & Google Pay?

Faster Checkout

Customers pay in seconds without typing card details

Higher Conversion

Reduce cart abandonment with one-tap payments

Enhanced Security

Tokenized payments protect sensitive data

Mobile-First

Perfect for smartphone shoppers

Step 1: Create a Payment Session

BACKENDServer-side

First, you will need to create a payment session, which will generate a SessionToken parameter that should be used when initiating the Embedded SDK.

ParameterDescription
API methodPaymentSessionCreate
ResponseJSON containing a SessionToken

View PaymentSessionCreate API Documentation

Response

{
"Status": 0,
"StatusMsg": "Success",
"Created": "2023-06-15T10:04:17Z",
"ExpDate": "2023-06-15T11:04:18Z",
"SessionToken": "eyJpbmZvIjoiMzQ2Mzk0LVZNS...",
"Signature": "NgSPrI16qrt91HU733Z2Ktw..."
}

Required Parameters

SIDstring

Store ID - Reference number for the Merchant Store in the myPOS system

Required
WalletNumberstring

myPOS Client Number (Account number)

Required
Amountdouble

The amount of payment requested (e.g., 23.45)

Required
Currencystring

ISO 3-character currency code (e.g., EUR, USD, GBP)

Required
OrderIDstring

Merchant order reference (up to 255 characters)

Required
CartItemsint

Number of items in the shopping cart

Required

Important: You'll need this SessionToken to initialize the SDK in the next steps.

Step 2: Initiate the Embedded SDK

FRONTENDClient-side

Download the latest version of the SDK from npm to get started with payment buttons.

Download mypos-embedded-checkout

Depending on your use case, to initiate the SDK you can do one of the following:

<script src="https://developers.mypos.com/repository/mypos-embedded-sdk.js" type="text/javascript"></script>

Then use the code below where you should pass the SessionToken received from the previous step as well as select the environment (Sandbox/Production):

if (MyPOSEmbedded.IS_APPLE_PAY_AVAILABLE) {
    MyPOSEmbedded.createApplePayButton(
        'embeddedButtons',  // div tag ID
        sessionToken,       // Received session token from IPCPaymentSessionCreate
        {
            isSandbox: true,        // Is sandbox env
            merchantName: "myPOS",  // Custom Merchant name
            onSuccess: function (data) {
                // On payment success
                console.log(data);
            },
            onDecline: function (err) {
                // On payment Declined
                console.error(err);
            }
        }
    ).then((sessionData) => {
        // When button is loaded
    }).catch((err) => {
        // Catched error loading
        console.error(err);
    });
} else {
    MyPOSEmbedded.createGooglePayButton(
        'embeddedButtons',  // div tag ID
        sessionToken,       // Received session token from IPCPaymentSessionCreate
        {
            isSandbox: true,  // Is sandbox env
            onSuccess: function (data) {
                // On payment Success
                console.log(data);
            },
            onDecline: function (data) {
                // On payment Declined
                console.error(data);
            }
        }
    ).then((sessionData) => {
        // When button is loaded
    }).catch((err) => {
        // Catched error loading
        console.error(err);
    });
}

Now all you need to do is place the following line in your HTML where you would like the payment buttons to be displayed:

<div id="embeddedButtons"></div>

Configuration Options

isSandboxboolean

Set to true for testing (Sandbox), false for production

Required
merchantNamestring

Custom merchant name displayed to customer

Apple Pay only
onSuccessfunction

Callback function triggered on successful payment

Callback
onDeclinefunction

Callback function triggered when payment is declined

Callback

Step 3: Validate the Payment Status

BACKENDServer-side

The status of each payment can be additionally checked by making an IPCGetPaymentStatus API request. This allows you to verify the payment was completed successfully on your server before fulfilling the order.

View IPCGetPaymentStatus API Documentation

Step 4: Store Settings in myPOS Account

APPLE PAYRequired for Apple Pay only

In order to make sure the Apple Pay payment buttons will be working correctly, you will need to go to your Store settings (in your myPOS Account) and configure the following.

Skip this step if you're only using Google Pay.

4.1 Host the Domain Association File

First, download the domain association file and host it at /.well-known/apple-developer-merchantid-domain-association on your site.

https://yoursite.com/.well-known/apple-developer-merchantid-domain-association

Download apple-developer-merchantid-domain-association

4.2 Configure Store Settings

1

Log in to your myPOS Account

Navigate to Store Settings

2

Add your page URL

Enter the URL in the "Embedded Apple Pay button URL" field

3

Add to Request URLs

This URL must also exist in the "Request URLs" list

4

Save your changes

Click Save to complete the process

Integration Checklist

Track your progress through the integration steps:

Track your integration progress:

0/7