View on GitHub

Amazon Pay SDK Samples

Amazon Pay Simple Checkout

Download this project as a .zip file Download this project as a tar.gz file

Test Cart

This is a test cart to show which calls need to be made to allow a buyer to make a purchase.

Note: This is a sandbox transaction. Your payment method will not be charged.

Product Description Quantity Total
Baldwin Entry Door Knob
Baldwin's Classic knob gives a comforting and invitingly warm impression. Clean lines and simple, architecturally-inspired designs exemplify timeless sophistication.
1 175.00

Code

Create the button container.

<div id="AmazonPayButton"></div>

Add script to set the client Id.

<script type='text/javascript'>
    window.onAmazonLoginReady = function () {
        amazon.Login.setClientId('CLIENT_ID');
        amazon.Login.setUseCookie(true);
    };
</script>

Import widgets javascript. This must be loaded after you set the client Id above.

USA
<script type='text/javascript' src='https://static-na.payments-amazon.com/OffAmazonPayments/us/sandbox/js/Widgets.js'></script>
UK
<script type='text/javascript' src='https://static-eu.payments-amazon.com/OffAmazonPayments/uk/sandbox/js/Widgets.js'></script>
DE
<script type='text/javascript' src='https://static-eu.payments-amazon.com/OffAmazonPayments/uk/sandbox/js/Widgets.js'></script>

Render the button. Note: You will need to add your domain to 'Allowed JavaScript Origins' in Seller Central. If you are testing locally you can use 'http://localhost'. Production sites must have a valid certificate and use https.

<script type='text/javascript'>
    var authRequest;
    OffAmazonPayments.Button("AmazonPayButton", "MERCHANT_ID", {
        type: "PwA",
        authorization: function () {
            loginOptions = { scope: "profile postal_code payments:widget payments:shipping_address", popup: true };
            authRequest = amazon.Login.authorize(loginOptions, "https://amzn.github.io/login-and-pay-with-amazon-sdk-samples/set.html");
        },
        onError: function (error) {
            // something bad happened
        }
    });
</script>

Is the customer still logged in?

In order to see if a user's session is active, and provide a link to log in, simply re-use the authorization function logic.

Get user profile with Javascript

<script type='text/javascript'>
    function verifyLoggedIn() {
        // if you want to display a message.
        var msgElem = document.getElementById("login-state-msg");

        var options = {
            scope: "profile postal_code payments:widget payments:shipping_address",
            popup: true,
            interactive: 'never'
        };

        // check if we are logged in
        authRequest = amazon.Login.authorize (options, function(response) {
            // this code is executed ASYNCHRONOUSLY

            if ( response.error ) {
                // USER NOT LOGGED IN
                console.log("verifyLoggedIn() - SESSION NOT ACTIVE - " + new Date());
                msgElem.innerHTML = "NOT logged in yet. Click 'Amazon Pay' or Go to Login screen.";
            } else {
                // USER IS LOGGED IN
                console.log("verifyLoggedIn() - SESSION ACTIVE - " + new Date());

                // optionally, get the profile info
                console.dir('access_token= ' + response.access_token);

                amazon.Login.retrieveProfile(function (response) {
                    // Display profile information.
                    console.dir('CustomerId= ' + response.profile.CustomerId);
                    console.dir('Name= ' + response.profile.Name);
                    console.dir('PostalCode= ' + response.profile.PostalCode);
                    console.dir('PrimaryEmail= ' + response.profile.PrimaryEmail);

                    msgElem.innerHTML = "Hello " + response.profile.Name + "! Just click Pay!";
                });
            }
        });
    }
</script>

Log Out

Logging out is simple.

  
amazon.Login.logout();