Bouton Web JavaScript

L'API Google Wallet permet à vos utilisateurs d'ajouter un objet à Google Wallet depuis le Web. Les utilisateurs peuvent ajouter leurs cartes directement depuis votre site Web.

Ce document de référence fournit des informations détaillées sur l'élément HTML g:savetoandroidpay qui affiche un bouton pour l'API Google Wallet ainsi que le jeton Web JSON décrivant votre service Web à Google.

API Google Wallet JavaScript

Pour analyser automatiquement les balises HTML g:savetoandroidpay lors du chargement, incluez la balise standard JavaScript

<script src="https://apis.google.com/js/platform.js" type="text/javascript"></script>

Pour les applications AJAX et le rendu explicite des boutons de l'API Google Wallet, incluez le paramètre "parsetags": "explicit".

<script src="https://apis.google.com/js/platform.js" type="text/javascript">
  {"parsetags": "explicit"}
</script>

Balise HTML g:savetoandroidpay

La balise d'espace de noms g:savetoandroidpay définit emplacement et à divers attributs du bouton Ajouter à Bouton Google Wallet Utilisez cette balise si vous affichez du code HTML et des jetons JWT côté serveur.

<g:savetoandroidpay jwt="JWT" onsuccess="successHandler" onfailure="failureHandler" />
Champ Type Obligatoire Description
height Chaîne N Hauteur du bouton à afficher. Les valeurs possibles sont: small (30 px de haut) et standard (38 pixels de haut). La valeur par défaut de height est small. Consultez Boutons de l'API Google Wallet. pour voir des exemples de boutons avec différents paramètres height.
jwt Chaîne O Jeton JWT de l'API Google Wallet.
onsuccess Chaîne N Nom de chaîne de l'enregistrement réussi de la fonction de gestionnaire de rappel.
onfailure Chaîne N Nom de chaîne de la fonction de gestionnaire de rappel ayant échoué à l'enregistrement. Cette fonction reçoit Objet error contenant les valeurs "errorCode" et "errorMessage".
onprovidejwt Chaîne N Nom de chaîne de la fonction de gestionnaire de jeton JWT fournie. L'objectif de cette fonction est de intercepter et potentiellement manipuler les données JWT avant que l'objet ne soit ajouté à Google Wallet. Cette fonction n'accepte aucun paramètre et doit renvoyer le jeton JWT sous forme de chaîne. Lors de l'implémentation du gestionnaire d'événements, les données JWT d'origine peuvent être récupérées sous le champ this.getOpenParams().renderData.userParams.jwt.
size Chaîne N Largeur du bouton à afficher. Vous pouvez définir size sur matchparent pour que la largeur corresponde à celle de l'élément parent. Ou quittez size n'est pas défini afin que la largeur s'adapte à celle du paramètre text. Consultez Boutons de l'API Google Wallet. pour voir des exemples de boutons avec différents paramètres size.
text Chaîne N Obsolète
textsize Chaîne N Si textsize=large est spécifié, affiche a considérablement augmenté la taille du texte et la taille du bouton, pour les cas avec des exigences particulières en matière d'interface utilisateur.
theme Chaîne N Thème du bouton à afficher. Les valeurs possibles sont: dark et light Le thème par défaut est dark. Consultez Boutons de l'API Google Wallet pour voir des exemples de boutons avec différents paramètres theme.

Jeton JWT de l'API Google Wallet

Le jeton JWT de l'API Google Wallet définit les objets et les classes à enregistrer.

Représentation JSON

{
  "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"]
}

Champs

Champ Type Obligatoire Description
iss Chaîne O Adresse e-mail générée par votre compte de service Google Cloud.
aud Chaîne O Audience. L'audience des objets de l'API Google Wallet sera toujours google
typ Chaîne O Type de jeton JWT. L'audience des objets de l'API Google Wallet sera toujours savetowallet
iat Entier O Émis à l'heure en secondes depuis l'epoch.
payload Objet O Objet de charge utile.
payload.eventTicketClasses Tableau N Classe de billets pour des événements à enregistrer.
payload.eventTicketObjects Tableau N Objet Billet pour un événement à enregistrer.
payload.flightClasses Tableau N Classe de vol à enregistrer.
payload.flightObjects Tableau N Objet Vol à enregistrer.
payload.giftCardClasses Tableau N Classe de carte cadeau à enregistrer.
payload.giftCardObjects Tableau N Objet Carte cadeau à enregistrer.
payload.loyaltyClasses Tableau N Classe de fidélité à enregistrer.
payload.loyaltyObjects Tableau N Objet Fidélité à enregistrer.
payload.offerObjects Tableau N Objet Offre à enregistrer.
payload.offerClasses Tableau N Classe d'offre à enregistrer.
payload.transitObjects Tableau N Objet Transports en commun à enregistrer.
payload.transitClasses Tableau N Classe de transports en commun à enregistrer.
origins Tableau O Tableau de domaines à approuver pour la fonctionnalité d'enregistrement JWT. L'API Google Wallet Le bouton ne s'affiche pas lorsque le champ origins n'est pas défini. Vous pourriez un message d'erreur "Load denied by X-Frame-Options" (Chargement refusé par X-Frame-Options) ou "Refus d'affichage" messages dans console du navigateur lorsque le champ "origins" n'est pas défini.

Le jeton JWT encodé doit ressembler à l'exemple suivant:

eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJnb29nbGUiLCJvcmlnaW5zIjpbImh0dHA6Ly9sb2NhbGhvc3Q6ODA4MCIsImh0dHA6Ly93d3cuZ29vZ2xlLmNvbSJdLCJpc3MiOiJzMmFwLXRvb2wuZ29vZ2xlLmNvbUBhcHBzcG90LmdzZXJ2aWNlYWNjb3VudC5jb20iLCJpYXQiOjE1NTE5ODcxNTEsInR5cCI6InNhdmV0b3dhbGxldCIsInBheWxvYWQiOnsib2ZmZXJPYmplY3RzIjpbeyJpZCI6IjMyMDI0MTMyNDE4NDM2OTk0MDEuMDFfT2ZmZXJPYmplY3RJZCJ9XX19.maHX40WWT29TC_kEb90EKQBH9AiTYAZR3153K8UI7fznVnfjVdlwsH_GKTECV3PGXdNnKCcmatUbKsONC0bxrnAHYG02kuvA1D3hSctz_amU66ntsvGIDe13mpxTzhI8fPvt9KMP1iaO7uOJuLQIHwipu4uRFAjyFaHGVaSFaP9c53qQyb_Zgyyk50M-MhH2n4kDpstNCqUJKWaadQkOWjrtMjwGzQ_ME04lbR4wb_mfK1A7Rc1UieWkxM9aMl5TOPubBKxKRRk_CqillN8XoTl9MI5RRGPuElVO28zGpYlFS6BarzDaaUfmbRZGvfF8ZiKrHZKxVrJjfZIJ2TCcDw

Fonction gapi.savetoandroidpay.render

Cette fonction vous permet d'afficher explicitement le bouton de l'API Google Wallet.

gapi.savetoandroidpay.render("dom-container",{
  "jwt": "JWT",
  "onsuccess": "successHandler",
  "onfailure": "failureHandler"
});
Champ Type Obligatoire Description
dom-container Chaîne O ID du conteneur dans lequel placer le bouton de l'API Google Wallet.
jwt Chaîne O Jeton JWT définissant le contenu à enregistrer.
onsuccess Chaîne N Nom de chaîne de l'enregistrement réussi de la fonction de gestionnaire de rappel.
onfailure Chaîne N Nom de chaîne de la fonction de gestionnaire de rappel ayant échoué à l'enregistrement. Cette fonction reçoit Objet error contenant les valeurs "errorCode" et "errorMessage".
onprovidejwt Chaîne N Nom de chaîne de la fonction de gestionnaire de jeton JWT fournie. L'objectif de cette fonction est de intercepter et potentiellement manipuler les données JWT avant que l'objet ne soit ajouté à Google Wallet. Cette fonction n'accepte aucun paramètre et doit renvoyer le jeton JWT sous forme de chaîne. Lors de l'implémentation du gestionnaire d'événements, les données JWT d'origine peuvent être récupérées sous le champ this.getOpenParams().renderData.userParams.jwt.

Codes et messages d'erreur de l'API Google Wallet

Les tableaux suivants répertorient les codes d'erreur et les messages d'erreur par défaut transmis dans le message d'erreur à la fonction de rappel d'échec lorsqu'un objet n'est pas correctement enregistré à l'aide du bouton JavaScript.

        {
          "errorCode": "errorCode",
          "errorMessage": "errorMessage"
        }
errorCode errorMessage
SERVICE_FAILURE Une erreur s'est produite sur le serveur Google Wallet.
CLASS_NOT_FOUND La classe référencée dans l'objet est introuvable.
CLASS_MISMATCH L'objet doit être présent, du même type, et doit faire référence à la classe incluse.
ORIGIN_MISMATCH L'origine du bouton ne correspond pas à celles spécifiées dans la liste des origines.
INVALID_NUM_TYPES Vous ne pouvez spécifier qu'un seul type d'objet.
INVALID_SIGNATURE Impossible de valider la signature.
INVALID_DUPLICATE_IDS Les objets ou classes en double ne sont pas autorisés.
INVALID_JWT Jeton JWT non valide.
INVALID_EXP_IAT Le jeton JWT a expiré ou a été émis dans le futur.
INVALID_AUD Valeur non valide pour le champ AUD.
INVALID_TYP Valeur non valide pour le champ TYP.
INVALID_NUM_OBJECTS Vous ne pouvez spécifier qu'un seul objet et une seule classe pour les cartes de fidélité, les cartes cadeaux et les offres.
MALFORMED_ORIGIN_URL Format de l'URL d'origine incorrect. L'URL doit contenir un protocole et un domaine.
MISSING_ORIGIN Vous devez spécifier une origine.
MISSING_FIELDS Il manquait des champs obligatoires dans l'objet ou la classe inclus.

Localisation

La langue du bouton JavaScript change en fonction des critères suivants:

  1. Si l'utilisateur est connecté à Google, le bouton s'affiche dans la langue préférée indiquée dans le profil du compte Google de l'utilisateur. Un utilisateur peut lire Changer de langue pour savoir comment modifier la langue préférée de son compte Google.
  2. Si l'utilisateur n'est pas connecté à Google, le bouton utilise la valeur ACCEPT-LANGUAGE. dans l'en-tête HTTP.

Si vous remarquez que le bouton ne s'affiche pas dans la bonne langue en fonction de la logique ci-dessus, ou si la formulation n'est pas naturelle, contactez notre équipe d'assistance.