Google Wallet API enables your users to add an object to Google Wallet from the web. Users can add their cards directly from your website.
This reference provides details about the HTML element g:savetoandroidpay
that
renders a Google Wallet API button
as well as the JSON Web Token
that describes your web service to Google.
Google Wallet API JavaScript
To automatically parse g:savetoandroidpay
HTML tags on load include the standard
JavaScript
<script src="https://apis.google.com/js/platform.js" type="text/javascript"></script>
For AJAX applications and explicit rendering of Google Wallet API buttons, include the "parsetags": "explicit"
parameter.
<script src="https://apis.google.com/js/platform.js" type="text/javascript"> {"parsetags": "explicit"} </script>
g:savetoandroidpay
HTML tag
The g:savetoandroidpay
namespace tag defines the
placement and various attributes of the Add to
Google Wallet button. Use this tag if you're rendering HTML and JWTs
server side.
<g:savetoandroidpay jwt="JWT" onsuccess="successHandler" onfailure="failureHandler" />
Field | Type | Required | Description |
---|---|---|---|
height |
String | N | Height of button to display. Possible values are: small (30px high) and
standard (38px high). The height defaults to small .
Refer to Google Wallet API buttons
to see samples of buttons with different height settings. |
jwt |
String | Y | Google Wallet API JWT. |
onsuccess |
String | N | String name of the save success callback handler function. |
onfailure |
String | N | String name of the save failure callback handler function. This function is passed an error object containing an errorCode and errorMessage. |
onprovidejwt |
String | N | String name of the provide JWT handler function. The purpose of this function is to
intercept and potentially manipulate the JWT data before the object is added to Google Wallet.
This function takes in no parameters and must return the JWT as String.
When implementing the event handler, the original JWT data can be retrieved
under field this.getOpenParams().renderData.userParams.jwt . |
size |
String | N | Width of button to display. You can set size to matchparent
to have the width match the width of the parent element. Or, leave size
undefined so that the width stretches to fit the width of the text setting.
Refer to Google Wallet API buttons
to see samples of buttons with different size settings. |
text |
String | N | Deprecated |
textsize |
String | N | When textsize=large is specified, displays
dramatically increased text size and
button size, for cases with special UI requirements. |
theme |
String | N | Theme of button to display. Possible values are: dark and
light . The default theme is dark . Refer to
Google Wallet API buttons
to see samples of buttons with different theme settings. |
Google Wallet API JWT
The Google Wallet API JWT defines the objects and classes to save.
JSON representation
{ "iss": "example_service_account@developer.gserviceaccount.com", "aud": "google", "typ": "savetowallet", "iat": 1368029586, "payload": { "eventTicketClasses": [{ ... //Event ticket Class JSON }], "eventTicketObjects": [{ // Event ticket Object JSON }], "flightClasses": [{ // Flight Class JSON }], "flightObjects": [{ // Flight Object JSON }], "giftCardClasses": [{ // Gift card Class JSON }], "giftCardObjects": [{ // Gift card Object JSON }], "loyaltyClasses": [{ // Loyalty Class JSON }], "loyaltyObjects": [{ // Loyalty Object JSON }], "offerClasses": [{ // Offer Class JSON }], "offerObjects": [{ // Offer Object JSON }], "transitClasses": [{ // Transit Class JSON }], "transitObjects": [{ // Transit Object JSON }] }, "origins": ["http://baconrista.com", "https://baconrista.com"] }
Fields
Field | Type | Required | Description |
---|---|---|---|
iss |
String | Y | Your Google Cloud service account generated email address. |
aud |
String | Y | Audience. The audience for Google Wallet API Objects will always be
google . |
typ |
String | Y | Type of JWT. The audience for Google Wallet API Objects will always be
savetowallet . |
iat |
Integer | Y | Issued at time in seconds since epoch. |
payload |
Object | Y | Payload object. |
payload.eventTicketClasses |
Array | N | Event Ticket Class to save. |
payload.eventTicketObjects |
Array | N | Event Ticket Object to save. |
payload.flightClasses |
Array | N | Flight Class to save. |
payload.flightObjects |
Array | N | Flight Object to save. |
payload.giftCardClasses |
Array | N | Gift Card Class to save. |
payload.giftCardObjects |
Array | N | Gift Card Object to save. |
payload.loyaltyClasses |
Array | N | Loyalty Class to save. |
payload.loyaltyObjects |
Array | N | Loyalty Object to save. |
payload.offerObjects |
Array | N | Offer Object to save. |
payload.offerClasses |
Array | N | Offer Class to save. |
payload.transitObjects |
Array | N | Transit Object to save. |
payload.transitClasses |
Array | N | Transit Class to save. |
origins |
Array | Y | Array of domains to approve for JWT saving functionality. The Google Wallet API
button will not render when the origins field is not defined. You could
potentially get a "Load denied by X-Frame-Options" or "Refused to display" messages in the
browser console when the origins field is not defined. |
Your encoded JWT should look similar to the following example:
eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJnb29nbGUiLCJvcmlnaW5zIjpbImh0dHA6Ly9sb2NhbGhvc3Q6ODA4MCIsImh0dHA6Ly93d3cuZ29vZ2xlLmNvbSJdLCJpc3MiOiJzMmFwLXRvb2wuZ29vZ2xlLmNvbUBhcHBzcG90LmdzZXJ2aWNlYWNjb3VudC5jb20iLCJpYXQiOjE1NTE5ODcxNTEsInR5cCI6InNhdmV0b3dhbGxldCIsInBheWxvYWQiOnsib2ZmZXJPYmplY3RzIjpbeyJpZCI6IjMyMDI0MTMyNDE4NDM2OTk0MDEuMDFfT2ZmZXJPYmplY3RJZCJ9XX19.maHX40WWT29TC_kEb90EKQBH9AiTYAZR3153K8UI7fznVnfjVdlwsH_GKTECV3PGXdNnKCcmatUbKsONC0bxrnAHYG02kuvA1D3hSctz_amU66ntsvGIDe13mpxTzhI8fPvt9KMP1iaO7uOJuLQIHwipu4uRFAjyFaHGVaSFaP9c53qQyb_Zgyyk50M-MhH2n4kDpstNCqUJKWaadQkOWjrtMjwGzQ_ME04lbR4wb_mfK1A7Rc1UieWkxM9aMl5TOPubBKxKRRk_CqillN8XoTl9MI5RRGPuElVO28zGpYlFS6BarzDaaUfmbRZGvfF8ZiKrHZKxVrJjfZIJ2TCcDw
gapi.savetoandroidpay.render
function
This function allows you to explicitly render the Google Wallet API button.
gapi.savetoandroidpay.render("dom-container",{ "jwt": "JWT", "onsuccess": "successHandler", "onfailure": "failureHandler" });
Field | Type | Required | Description |
---|---|---|---|
dom-container |
String | Y | ID of container to place Google Wallet API button. |
jwt |
String | Y | JWT defining content to save. |
onsuccess |
String | N | String name of the save success callback handler function. |
onfailure |
String | N | String name of the save failure callback handler function. This function is passed an error object containing an errorCode and errorMessage. |
onprovidejwt |
String | N | String name of the provide JWT handler function. The purpose of this function is to
intercept and potentially manipulate the JWT data before the object is added to Google Wallet.
This function takes in no parameters and must return the JWT as String.
When implementing the event handler, the original JWT data can be retrieved
under field this.getOpenParams().renderData.userParams.jwt . |
Google Wallet API error codes and messages
The following tables list the error codes and default error messages passed in the error object to the failure callback function, when an object doesn't save successfully using the JavaScript button.
{ "errorCode": "errorCode", "errorMessage": "errorMessage" }
errorCode |
errorMessage |
---|---|
SERVICE_FAILURE |
An error occurred on the Google Wallet server. |
CLASS_NOT_FOUND |
Class referenced in object was not found. |
CLASS_MISMATCH |
Object must be present, of the same type, and must reference the enclosed class. |
ORIGIN_MISMATCH |
Origin of button does not match those specified in the origins list. |
INVALID_NUM_TYPES |
Exactly one type of object can be specified. |
INVALID_SIGNATURE |
Signature could not be verified. |
INVALID_DUPLICATE_IDS |
Duplicates objects or classes are not allowed. |
INVALID_JWT |
Invalid JWT. |
INVALID_EXP_IAT |
JWT expired or was issued in the future. |
INVALID_AUD |
Invalid value for AUD field. |
INVALID_TYP |
Invalid value for TYP field. |
INVALID_NUM_OBJECTS |
Exactly one object and at most one class can be specified for loyalty cards, gift cards, and offers. |
MALFORMED_ORIGIN_URL |
Malformed origin url. Url must contain a protocol and domain. |
MISSING_ORIGIN |
Origin must be specified. |
MISSING_FIELDS |
Enclosed object or class was missing required fields. |
Localization
The language in the JavaScript button changes based on the following criteria:
- If the user is logged into Google, the button renders in the preferred language given in the user's Google account profile. A user can read Change language to learn how to change their Google account's preferred language.
- If the user isn't logged into Google, the button uses the
ACCEPT-LANGUAGE
value in the HTTP header.
If you notice the button doesn't render in the correct language based on the logic above, or if the wording is unnatural, contact our support team.
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Last updated 2024-10-29 UTC.