Skip to main content

Guest BBAP / Remedial BBAP

Guest BBAP and Remedial BBAP is another way to provide Amazon Pay to buyers.

Guest BBAP

Guest BBAP saves the buyer who is about to drop from standard checkout flow due to complicated input forms. When BBAP is implemented on EC site, Amazon Pay popup is rendered on the page immediately or after certain period (duration can be set by merchant, or with buyer’s behavior as a trigger) and buyer can use Amazon Pay to skip the input form and continue purchasing journey with Amazon Pay. It helps reducing number of buyers drop from EC site at this point.

Cart page
Input form
Input form + BBAP
Amazon Pay Hosted page in general
Amazon Pay Hosted page redirect to merchant siteMerchant processing after buyer signs in with AmazonMerchant site after Get Checkout SessionMerchant processing after "Place Order"Amazon Pay Hosted pageMerchant processingMerchant site
Buyer clicks "Checkout" button
● ● ●
Cart page

Amazon Pay
▶︎The buyer sees input form where they are required to input multiple information

🙁 "Oh... I don't want to input all these..."
● ● ●
Input form
Buyer information

Shipping address

Payment instrument

▶︎Amazon Pay button is rendered in a pop-up on the page after a few seconds.

😀 "Wow! Can I skip this form by using Amazon Pay?..."

The buyer clicks Amazon Pay button.
● ● ●

*Above is a BBAP rendering image in English. Please note actual explanation in popup is in Japanese.

Button rendering script example is provided here
▶︎
The buyer is redirected to Amazon Pay Hosted page, and sign-in with Amazon ID and Password.
▶︎
After sign-in is complete, buyer is redirected to either "a page where buyer can select shipping address+payment instrument" OR "a consent page", and click "Continue to checkout" button.
Merchant cannot control which page to show to buyers in principle.
Hosted Page for shipping address/payment instrument selection
For productType="PayAndShip"
Merchant
Shipping address
Test Taro 153-0064 Shimomeguro 1-8-1, Meguro, Tokyo0
Payment instrument
VISA xxxx1111

For productType="PayOnly"
Merchant
Payment instrument
VISA xxxx1111

When the buyer clicks "Change" button
Please select shipping address
◉ Test Seimei
1530064
Shimomeguro 1-8-1, Meguro, Tokyo
Japan
○ Test Meispace
153-0064
Shimomeguro 1-8-1, Meguro, Tokyo
Japan
+ Add new address


Please select payment instrument
◉ VISA xxxx1111
xxx
Expiry 05/2023
○ American Express xxxx0005
xxxx
Expiry 05/2023

Hosted Page with consent
✔️
Signed in with Amazon account

▶︎
When the buyer clicks "Continue to checkout" button, Amazon Pay redirects buyer to checkoutReviewReturnUrl set in createCheckoutSessionConfig.payloadJSON by merchant. Amazon Pay adds amazonCheckoutSessionId as a URL parameter.
i.e. https://anyurl.com/review/? amazonCheckoutSessionId=26be7331-7dc2-4722-be22-f7e75582d3ef
▶︎
Merchant then call Get Checkout Session API with amazonCheckoutSessionId.
Merchant receives shipping address, payment instruments as API response
Ref: Get Checkout Session response
▶︎Merchant renders Order review page.

The buyer clicks "Place Order" button.
● ● ●
Order review page
Shipping address
〒153-0064
Shimomeguro 1-8-1, Meguro, Tokyo
Amazon Taro

Payment instrument
VISA 1111xxxx (Amazon Pay)

Order detail
Item
Price
Quant.
Total
Coffee Beans
Coffee beans
¥2,000
1
¥2,000
Coffee Beans
Coffee cup
¥500
1
¥500
Total
¥2,500

Note: Even with BBAP, merchant needs to call Update Checkout Session API, redirect to amazonPayRedirectUrl and call Complete Checkout Session API to complete Checkout as same with general Amazon Pay checkout.
▶︎
Merchant calls Update Checkout Session API to update final order amount and paymentIntent to respective CheckoutSession using amazonCheckoutSessionId.

Please note there are three values supported with paymentIntent, and depeneding on paymentIntent, subsequent processes varies. Find more detail with Specification - Parameter - PaymentIntent

When Update Checkout Session succeeds, Amazon Pay returns amazonPayRedirectUrl in API response. Merchant then redirects to amazonPayRedirectUrl.
You will find below in "webCheckoutDetails" in Update Checkout Session API response;
"amazonPayRedirectUrl": "https://pay.amazon.com/redirect/checkoutId-1"

Ref: Integration Guide - Update Checkout Session response sample
▶︎

When process successfully completes, Amazon Pay redirects to checkoutResultReturnUrl set by merchant in payloadJSON. webCheckoutDetails.checkoutResultReturnUrl.
Amazon Pay adds amazonCheckoutSessionId as a URL parameter
i.e. https://anyurl.com/result/?amazonCheckoutSessionId=26be7331-7dc2-4722-be22-f7e75582d3ef
▶︎
Merchant then calls Complete Checkout Session API to complete checkout.
Amazon Pay returns chargePermissionId and maybe chargeId in API response.
Merchants needs these IDs for subsequent processes, so merchant needs to save them in their database linked to respective order information
Ref: Integration Guide - Complete Checkout Session response sample
There is a chance that payment process fails, so merchant needs to implement error handling properly.
Error handling
Re: Integration Guide - Manage erros
▶︎
Merchant shows order confirmation page.

● ● ●
Order confirmation page
✔️

Remedial BBAP

Remedial BBAP saves the buyer who is about to give up to pay with credit card because of Authorization failure by taking buyer to Amazon Pay checkout with the higher Authorization success rate. Some merchants have high rates of authorization failures with other payment methods. In such case, merchant can implement Remedial BBAP which pops up on the page to introduce Amazon Pay as an alternative payment method to such declined buyers. Some merchants struggle with too high authorization decline rate while they believe many of them are false positive. To save those false positive, merchant can use this feature.

Remedial BBAP + APB

Cart page
Input form
Order review page
Order review page + authorization decline
Amazon pay hosted page
Amazon Pay Hosted page for APBMerchant processingMerchant site
Go to the next page with guest standard checkout.
● ● ●
Cart page

Amazon Pay
▶︎The buyer sees input form where they are required to input multiple information

🙁 "Oh... I don't want to input all these..., but I will try!"

Buyer inputs information in the form and clicks "Next" button.
● ● ●
Input form
Buyer information

Shipping address

Payment instrument

▶︎Buyer clicks “Place Order” button.
*Assuming that buyer chose credit card as a payment method in this example.
● ● ●
Order review page
Shipping address
〒153-0064
Shimomeguro 1-8-1, Meguro, Tokyo
Amazon Taro

Payment instrument
VISA 1111xxxx

Order detail
Item
Price
Quant.
Total
Coffee Beans
Coffee beans
¥2,000
1
¥2,000
Coffee Beans
Coffee cup
¥500
1
¥500
Total
¥2,500

▶︎Attempt to obtain authorization in backend… but authorization is declined.
The buyer sees authorization decline message.


🙁 "Oh... do I have to input another credit card information?"
● ● ●
Order review page
We are sorry. Selected payment method failed. Please select another payment method.
Shipping address
〒153-0064
Shimomeguro 1-8-1, Meguro, Tokyo
Amazon Taro

Payment instrument
VISA 1111xxxx

Order detail
Item
Price
Quant.
Total
Coffee Beans
Coffee beans
¥2,000
1
¥2,000
Coffee Beans
Coffee cup
¥500
1
¥500
Total
¥2,500

▶︎Amazon Pay button is rendered in a pop-up on the page after a few seconds.

😀 "Ah OK. Let me try with Amazon Pay"

The buyer clicks Amazon Pay button.
● ● ●

*Above is a Remedial BBAP rendering image in English. Please note actual explanation in popup is in Japanese.

Button rendering script example is provided here
▶︎
The buyer is redirected to Amazon Pay Hosted page, and sign-in with Amazon ID and Password.
▶︎
In case of APB
After sign-in is complete, the buyer sees Amazon Pay Hosted page with shipping address and payment instrument, and clicks "Pay Now" button.

With APB,
1. Shipping address is provided to Amazon by merchant in payloadJSON.addressDetails.
2. Amount is provided to Amazon by merchant in payloadJSON.paymentDetails.chargeAmount.
3. Amazon shows "Pay Now" button instead of "Continue to checkout"
It executes payment upon the buyer clicking "Pay Now" button.
Hosted Page for payment instrument selection
For productType="PayAndShip"
Merchant
Shipping address
Test Seimei 153-0064 Shimomeguro 1-8-1, Meguro, Tokyo
Shipping address is from input in [merchant-name] website.
Instrument
VISA xxxx1111
Amount
¥10,000

For productType="PayOnly"
Merchant
Payment instruyment
VISA xxxx1111
Amount
¥10,000

When the buyer clicks "Change" button
Please select payment instrument
◉ VISA xxxx1111
xxx
Expiry 05/2023
○ American Express xxxx0005
xxxx
Expiry 05/2023

▶︎

When process successfully completes, Amazon Pay redirects to checkoutResultReturnUrl set by merchant in payloadJSON. webCheckoutDetails.checkoutResultReturnUrl.
Amazon Pay adds amazonCheckoutSessionId as a URL parameter
i.e. https://anyurl.com/result/?amazonCheckoutSessionId=26be7331-7dc2-4722-be22-f7e75582d3ef
▶︎
Merchant then calls Complete Checkout Session API to complete checkout.
Amazon Pay returns chargePermissionId and maybe chargeId in API response.
Merchants needs these IDs for subsequent processes, so merchant needs to save them in their database linked to respective order information
Ref: Integration Guide - Complete Checkout Session response sample
There is a chance that payment process fails, so merchant needs to implement error handling properly.
Error handling
Re: Integration Guide - Manage erros
▶︎
Merchant shows order confirmation page.

● ● ●
Order confirmation page
✔️

Remedial BBAP + PayOnly

Cart page
Input form
Order review page
Order review page + authorization decline
Amazon Pay Hosted page in generalAmazon Pay Hosted page redirect to merchant siteMerchant processing after buyer signs in with AmazonMerchant site after Get Checkout SessionMerchant processing after "Place Order"Amazon Pay Hosted pageMerchant processingMerchant site
Go to the next page with guest standard checkout.
● ● ●
Cart page

Amazon Pay
▶︎The buyer sees input form where they are required to input multiple information

🙁 "Oh... I don't want to input all these..., but I will try!"

Buyer inputs information in the form, and click "Next" button.
● ● ●
Input form
Buyer information

Shipping address

Payment instrument

▶︎Buyer clicks “Place Order” button.
*Assuming that buyer chose credit card as a payment method in this example.
● ● ●
Order review page
Shipping address
〒153-0064
Shimomeguro 1-8-1, Meguro, Tokyo
Amazon Taro

Payment instrument
VISA 1111xxxx

Order detail
Item
Price
Quant.
Total
Coffee Beans
Coffee beans
¥2,000
1
¥2,000
Coffee Beans
Coffee cup
¥500
1
¥500
Total
¥2,500

▶︎Attempt to obtain authorization in backend… but authorization is declined.
The buyer sees authorization decline message.


🙁 "Oh... do I have to input another credit card information?"
● ● ●
Order review page
We are sorry. Selected payment method failed. Please select another payment method.
Shipping address
〒153-0064
Shimomeguro 1-8-1, Meguro, Tokyo
Amazon Taro

Payment instrument
VISA 1111xxxx

Order detail
Item
Price
Quant.
Total
Coffee Beans
Coffee beans
¥2,000
1
¥2,000
Coffee Beans
Coffee cup
¥500
1
¥500
Total
¥2,500

▶︎Amazon Pay button is rendered in a pop-up on the page after a few seconds.

😀 "Ah OK. Let me try with Amazon Pay"

The buyer clicks Amazon Pay button.
● ● ●

*Above is a Remedial BBAP rendering image in English. Please note actual explanation in popup is in Japanese.

Button rendering script example is provided here
▶︎
The buyer is redirected to Amazon Pay Hosted page, and sign-in with Amazon ID and Password.
▶︎
In case of PayOnly
After sign-in is complete, buyer is redirected to "a page where buyer can select payment instrument".
For productType="PayOnly"
Merchant
Payment instrument
VISA xxxx1111

When the buyer clicks "Change" button
Please select payment instrument
◉ VISA xxxx1111
xxx
Expiry 05/2023
○ American Express xxxx0005
xxxx
Expiry 05/2023

▶︎
When the buyer clicks "Continue to checkout" button, Amazon Pay redirects buyer to checkoutReviewReturnUrl set in createCheckoutSessionConfig.payloadJSON by merchant. Amazon Pay adds amazonCheckoutSessionId as a URL parameter.
i.e. https://anyurl.com/review/? amazonCheckoutSessionId=26be7331-7dc2-4722-be22-f7e75582d3ef
▶︎
Merchant then call Get Checkout Session API with amazonCheckoutSessionId.
Merchant receives payment instruments in API response.
Ref: Get Checkout Session response
▶︎
Merchant renders Order review page (render payment instrument information received from Amazon).

The buyer clicks "Place Order" button.
● ● ●
Order review page
Shipping address
〒153-0064
Shimomeguro 1-8-1, Meguro, Tokyo
Amazon Taro

Payment instrument
VISA 1111xxxx (Amazon Pay)

Order detail
Item
Price
Quant.
Total
Coffee Beans
Coffee beans
¥2,000
1
¥2,000
Coffee Beans
Coffee cup
¥500
1
¥500
Total
¥2,500

▶︎
Merchant calls Update Checkout Session API to update final order amount and paymentIntent to respective CheckoutSession using amazonCheckoutSessionId.

Please note there are three values supported with paymentIntent, and depeneding on paymentIntent, subsequent processes varies. Find more detail with Specification - Parameter - PaymentIntent

When Update Checkout Session succeeds, Amazon Pay returns amazonPayRedirectUrl in API response. Merchant then redirects to amazonPayRedirectUrl.
You will find below in "webCheckoutDetails" in Update Checkout Session API response;
"amazonPayRedirectUrl": "https://pay.amazon.com/redirect/checkoutId-1"

Ref: Integration Guide - Update Checkout Session response sample
▶︎

When process successfully completes, Amazon Pay redirects to checkoutResultReturnUrl set by merchant in payloadJSON. webCheckoutDetails.checkoutResultReturnUrl.
Amazon Pay adds amazonCheckoutSessionId as a URL parameter
i.e. https://anyurl.com/result/?amazonCheckoutSessionId=26be7331-7dc2-4722-be22-f7e75582d3ef
▶︎
Merchant then calls Complete Checkout Session API to complete checkout.
Amazon Pay returns chargePermissionId and maybe chargeId in API response.
Merchants needs these IDs for subsequent processes, so merchant needs to save them in their database linked to respective order information
Ref: Integration Guide - Complete Checkout Session response sample
There is a chance that payment process fails, so merchant needs to implement error handling properly.
Error handling
Re: Integration Guide - Manage erros
▶︎
Merchant shows order confirmation page.

● ● ●
Order confirmation page
✔️

How to implement Guest/Remedial BBAP

  1. Download the sample code from amazonPayAssist.js, and save it in your repositry.
  2. Customize the popup design and display logic with BBAP customization tool, and get sample javascript code generated specifically for your site.
  3. Add javascript (you get in #2) on your site.

Please see more detail in FAQ.

Ref (only available in Japanese): FAQ - How to integrate Guest BBAP / Remedial BBAP

Button rendering script

Each BBAP button rendering script will be generated via BBAP customization tool in principle.
Below is sample rendering scripts for your reference.

BBAP rendering script sample

<body>
<div id="AmazonPayButton"></div>
<script type="text/javascript" src="amazonpayAssist.js"></script>
<script src="https://static-fe.payments-amazon.com/checkout.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">

//javascript to generate popup
amazonpayAssist('AmazonPayButton', {
type: "form",
color: "green"
}).fadeIn(1);

amazon.Pay.renderButton('#AmazonPayButton', {
// set checkout environment
merchantId: 'xxxxxx', //(Required) Please input your merchantId*1
ledgerCurrency: 'JPY', //(Required) Please set JPY in case of Japan
sandbox: true, // (Optional) If you test in Sandbox, please set it true
checkoutLanguage: 'ja_JP', //(Required) Please et ja_JP in case of Japan
productType: 'PayAndShip', //(Required) Please refer to product type detail*2
placement: 'Cart', //(Required) Please refer to placement detail*3
buttonColor: 'Gold', //(Required) Please refer to buttonColor detail*4
createCheckoutSessionConfig: {
payloadJSON: {
"webCheckoutDetails": {
"checkoutReviewReturnUrl": "https://a.com/merchant-review-page" //(Required) Please input your order review page URL
},
"storeId": "amzn1.application-oa2-client.xxxxxxx", //(Required) Please input your storeId*1
"scopes": ["name", "email", "phoneNumber", "billingAddress"], //(Optional) Please input scopes as you need such buyer information
"deliverySpecifications": { //(Optional) Please refer to deliverySpecifications detail*5
"addressRestrictions": {
"type": "Allowed",
"restrictions": {
"JP": {
"statesOrRegions" : ["東京都"],
"zipCodes": ["1530064"]
}
}
}
}
},
signature: 'xxxx', //(Required) Please input payload signature*6
publicKeyId: 'xxxxxxxxxx' //(Required) Please input your publicKeyId*7
}
});
</script>
</body>

Remedial BBAP rendering script APB sample

<body>
<div id="AmazonPayButton"></div>
<script type="text/javascript" src="amazonpayAssist.js"></script>
<script src="https://static-fe.payments-amazon.com/checkout.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">

//javascript to generate popup
amazonpayAssist('AmazonPayButton', {
type: "card",
color: "blue"
}).fadeIn(1);

amazon.Pay.renderButton('#AmazonPayButton', {
// set checkout environment
merchantId: 'xxxxxx', //(Required) Please input your merchantId*1,
ledgerCurrency: 'JPY', //(Required) Please set JPY in case of Japan
sandbox: true, //(Optional) If you test in Sandbox, please set it true
checkoutLanguage: 'ja_JP', //(Required) Please set ja_JP in case of Japan
productType: 'PayAndShip', //(Required) Please refer to product type detail*2
placement: 'Checkout', //(Required) Please refer to placement detail*3
buttonColor: 'Gold', //(Required) Please refer to buttonColor detail*4
createCheckoutSessionConfig: {
payloadJSON: {
"webCheckoutDetails": {
"checkoutResultReturnUrl": "https://a.com/merchant-result-page", //(Required) Please input your order result page URL
"checkoutMode": "ProcessOrder" //(Required) This is a flag for APB
},
"storeId": "amzn1.application-oa2-client.xxxxxx", //(Required) Please input your storeId*1
"scopes": ["name", "email", "phoneNumber", "billingAddress"], //(Optional) Please input scopes as you need such buyer information
"paymentDetails": { //(Required in case of APB) Please refer to paymentDetails detail*5
"paymentIntent": "AuthorizeWithCapture",
"chargeAmount": {
"amount": "9000",
"currencyCode": "JPY"
}
},
"merchantMetadata": { //(Optional) Please refer to merchantMetadata detail*6
"merchantReferenceId":"Merchant-order-123",
"merchantStoreName":"Merchant Store Name",
"noteToBuyer":"Thank you for your order"
},
"addressDetails": { //(Required in case of APB - PayAndShip) Please refer to addressDetails detail*7
"name": "Paul Smith",
"addressLine1": "Meguro-ku, Shimomeguro 1-8-1",
"stateOrRegion": "Tokyo",
"postalCode": "153-0064",
"countryCode": "JP",
"phoneNumber": "0333333333"
}
},
signature: 'xxxx', //(Required) Please input payload signature*6
publicKeyId: 'xxxxxxxxxx' //(Required) Please input your publicKeyId*7
}
});
</script>
</body>

Remedial BBAP rendering script PayOnly sample

<body>
<div id="AmazonPayButton"></div>
<script type="text/javascript" src="amazonpayAssist.js"></script>
<script src="https://static-fe.payments-amazon.com/checkout.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">

//javascript to generate popup
amazonpayAssist('AmazonPayButton', {
type: "card",
color: "blue"
}).fadeIn(1);

amazon.Pay.renderButton('#AmazonPayButton', {
// set checkout environment
merchantId: 'xxxxxx', //(Required) Please input your merchantId*1
ledgerCurrency: 'JPY', //(Required) Please set JPY in case of Japan
sandbox: true, // (Optional) If you test in Sandbox, please set it true
checkoutLanguage: 'ja_JP', //(Required) Please set ja_JP in case of Japan
productType: 'PayOnly', //(Required) Please refer to product type detail*2
placement: 'Cart', //(Required) Please refer to placement detail*3
buttonColor: 'Gold', //(Required) Please refer to buttonColor detail*4
createCheckoutSessionConfig: {
payloadJSON: {
"webCheckoutDetails": {
"checkoutReviewReturnUrl": "https://a.com/merchant-review-page" //(Required) Please input your order review page URL
},
"storeId": "amzn1.application-oa2-client.xxxxxxx", //(Required) Please input your storeId*1
"scopes": ["name", "email", "phoneNumber", "billingAddress"], //(Optional) Please input scopes as you need such buyer information
},
signature: 'xxxx', //(Required) Please input payload signature*6
publicKeyId: 'xxxxxxxxxx' //(Required) Please input your publicKeyId*7
}
});
</script>
</body>