Google Pay Payment Page

To process Google Pay request, the ccElement and gpElement must be rendered on the page in 2 separate forms. The customer name and email must be filled in. When the Google Pay button is clicked, the customer will be prompted to pick a card from their Google wallet and authorise the payment. Once authorised, Google will respond with a Google Pay payment token. This generated payment token is automatically inserted into the payment form, then the whole form with the payment token is submitted.

In a PHP implementation, your payment page may look like this:

...

<body>
    <form method="POST" action="process" id="payment">
        @csrf
        {!! $ccElement !!}
        <input type="hidden" id="merchant_data" name="merchant_data" value="{\"order_id\": \"12345\"}" />
        <button type="submit">Submit</button>
    </form>
    <form method="POST" action="process" id="gpPayment">
        @csrf
        {!! $gpElement !!}
        <input type="hidden" id="merchant_data" name="merchant_data" value="{\"order_id\": \"12345\"}" />
        <button type="submit">Submit</button>
    </form>
</body>

Elements

These are the elements that were fetched from the Intents resource. Specifically the ccElement and gpElement.

{!! $ccElement !!}
{!! $gpElement !!}

Merchant Data Element

This is an optional element, which is hidden. It can be used to send important order or customer details that should be linked to the transaction. The value should be json string with double quotes delimited by backslashes.

<input type="hidden" id="merchant_data" name="merchant_data" value="{\"order_id\": \"12345\"}" />