Skip to main content

Documentation Index

Fetch the complete documentation index at: https://bancofcalifornia-preview.mintlify.app/llms.txt

Use this file to discover all available pages before exploring further.

Google Pay allows customers to provide credit card data saved in their Google accounts to be used in online payments. Collect.js supports Google Pay in both lightbox and inline integrations allowing you to capture these credit card details in either flow. And to make the integration as seamless as possible, the Google Pay data will be returned to you in the “payment_token” variable, so no matter what payment method your customers make, your transaction request can be exactly the same. Google Pay data can be used for single transactions, stored to the Customer Vault, or used to initiate a recurring payment. To use Google Pay, you must provide Collect.js country and currency values. These values are used to ensure the user can only select a valid card. You must also provide an HTML element on your page that Collect.js can use to draw the Google Pay button. Google Pay is currently supported on TSYS - EMV and Elavon viaConex. 
                <html>
    <head>
        <script
            src="https://gateway.bancedge.com/token/Collect.js"
            data-tokenization-key="000000-000000-000000-000000"
            data-variant="inline"
            data-country="US"
            data-price="1.00"
            data-currency="USD"
        ></script>
    </head>
    <body>
        <form action="submit_to_direct_post_api.php" method="post">
            <div id="googlepaybutton"></div>
        </form>
    </body>
</html>
This will create a Google Pay button that will be inserted in the div as an iframe. The Google Pay button will be 240x70px, so make sure to leave room in this div for the button to display in full. When a user clicks the button, they are presented with a payment sheet requesting the user’s payment details. After the user submits the payment sheet, Collect.js executes the callback function if one were provided, or submits your form with the payment token attached.

​
Capture Billing and Shipping Data

Collect.js also allows you to capture the user’s shipping and billing details with Google Pay, just like the credit card data. This eliminates the need for you to capture this manually in your own web form. When these options are enabled, Google Pay will also request the user’s information and Collect.js will store all that data in the payment token. In addition to the payment data that gets stored for all Google Pay transactions, the payment token will include the following shipping fields when shipping address required is enabled:
  • shipping_address_1
  • shipping_address_2
  • shipping_zip
  • shipping_city
  • shipping_state
  • shipping_country
  • shipping_firstname
  • shipping_lastname
  • phone (also requires phone_number_required to be enabled)
When billing_address_required is enabled, Collect.js will also capture these fields:
  • address1 (also requires format to be “FULL”)
  • address2 (also requires format to be “FULL”)
  • zip
  • city (also requires format to be “FULL”)
  • state (also requires format to be “FULL”)
  • country
  • firstname
  • lastname
  • phone (also requires phone_number_required to be enabled)
                <html>
    <head>
        <script
            src="https://secure.networkmerchants.com/token/Collect.js"
            data-tokenization-key="000000-000000-000000-000000"
            data-variant="inline"
            data-field-google-pay-selector=".google-pay-button"
            data-field-google-pay-shipping-address-required="true"
            data-field-google-pay-shipping-address-parameters-phone-number-required="true"
            data-field-google-pay-shipping-address-parameters-allowed-country-codes="US,CA"
            data-field-google-pay-billing-address-required="true"
            data-field-google-pay-billing-address-parameters-phone-number-required="true"
            data-field-google-pay-billing-address-parameters-format="MIN"
        ></script>
    </head>
    <body>
        <form action="submit_to_direct_post_api.php" method="post">
            <div class="google-pay-button"></div>
        </form>
    </body>
</html>

{
	tokenType: "googlePay",
	token: "3455zJms-7qA2K2-VdVrSu-Rv7WpvPuG7s8",
	initiatedBy: Event,
	card:{
		number: null,
		bin: null,
        exp: null,
        hash: null,
		type: "visa"
	},
	check:{
		name:null,
		account:null,
		hash:null,
		aba:null,
		check:null,
		institution:null
	},
	wallet: {
		cardDetails: "1234",
		cardNetwork: "visa",
		email: "email@example.com",
		billingInfo: {
			address1: "123 Happy Ln",
			address2: "APT 1",
			firstName: "Jane",
			lastName: "Doe",
			postalCode: "12345",
			city: "Cooltown",
			state: "AZ",
			country: "US",
			phone: "1234567890"

		},
		shippingInfo: {
			address1: "123 Happy Ln",
			address2: "APT 1",
			firstName: "Jane",
			lastName: "Doe",
			postalCode: "12345",
			city: "Cooltown",
			state: "AZ",
			country: "US",
			phone: "1234567890"
		}

	}
}