JavaScript 网页按钮

您的用户可通过 Google Wallet API 从网络向 Google 钱包添加对象。 用户可以直接从您的网站添加银行卡。

本参考提供了有关 HTML 元素 g:savetoandroidpay 的详细信息,该元素 呈现 Google Wallet API 按钮 以及 JSON Web 令牌 ,用于向 Google 说明您的网络服务。

Google Wallet API JavaScript

若要在加载时自动解析 g:savetoandroidpay HTML 标记,请添加标准 JavaScript

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

若想实现 AJAX 应用以及显式呈现 Google Wallet API 按钮,请添加 "parsetags": "explicit" 参数。

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

g:savetoandroidpay HTML 标记

g:savetoandroidpay 命名空间标记定义了 以及“添加到”中的各种属性 “Google 钱包”按钮。如果您要呈现 HTML 和 JWT,请使用此标记 。

<g:savetoandroidpay jwt="JWT" onsuccess="successHandler" onfailure="failureHandler" />
字段 类型 必需 说明
height 字符串 否 要显示的按钮的高度。可能的值包括:small(高度为 30 像素)和 standard(高 38 像素)。height 默认为 small。 请参阅 Google Wallet API 按钮 查看采用不同 height 设置的按钮示例。
jwt 字符串 是 Google Wallet API JWT。
onsuccess 字符串 否 保存成功回调处理程序函数的字符串名称。
onfailure 字符串 否 保存失败回调处理程序函数的字符串名称。系统会向此函数传递 包含 errorCode 和 errorMessage 的错误对象。
onprovidejwt 字符串 否 提供的 JWT 处理程序函数的字符串名称。该函数的用途是 在将对象添加到 Google 钱包之前,拦截 JWT 数据并可能操纵这些数据。 此函数不接受任何参数,并且必须以字符串形式返回 JWT。 在实现事件处理脚本时,可以检索原始 JWT 数据 在字段 this.getOpenParams().renderData.userParams.jwt 下。
size 字符串 否 要显示的按钮的宽度。您可以将 size 设置为 matchparent。 使宽度与父元素的宽度一致。或者,退出“size” 未定义,以便拉伸宽度以适应 text 设置的宽度。 请参阅 Google Wallet API 按钮 查看采用不同 size 设置的按钮示例。
text 字符串 否 已弃用
textsize 字符串 否 指定 textsize=large 后,系统会显示 显著增大文字大小, 按钮大小(适用于具有特殊界面要求的场景)。
theme 字符串 否 要显示的按钮的主题。可能的值包括:dark 和 light。默认主题为 dark。请参阅 Google Wallet API 按钮 查看采用不同 theme 设置的按钮示例。

Google Wallet API JWT

Google Wallet API JWT 定义了要保存的对象和类。

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

字段

字段 类型 必需 说明
iss 字符串 是 您的 Google Cloud 服务账号生成的电子邮件地址。
aud 字符串 是 受众群体。Google Wallet API 对象的受众将始终为 google。
typ 字符串 是 JWT 的类型。Google Wallet API 对象的受众将始终为 savetowallet。
iat 整数 是 从新纪元开始的时间(以秒为单位)。
payload 对象 是 载荷对象。
payload.eventTicketClasses 数组 否 要保存的活动门票类。
payload.eventTicketObjects 数组 否 要保存的活动门票对象。
payload.flightClasses 数组 否 要保存的航班类。
payload.flightObjects 数组 否 要保存的广告投放对象。
payload.giftCardClasses 数组 否 要保存的礼品卡类。
payload.giftCardObjects 数组 否 要保存的礼品卡对象。
payload.loyaltyClasses 数组 否 要保存的会员卡类。
payload.loyaltyObjects 数组 否 要保存的会员卡对象。
payload.offerObjects 数组 否 要保存的优惠对象。
payload.offerClasses 数组 否 要保存优惠类。
payload.transitObjects 数组 否 要保存的公交对象。
payload.transitClasses 数组 否 要保存的公交类。
origins 数组 是 获准使用 JWT 保存功能的网域数组。Google Wallet API 如果未定义 origins 字段,按钮将不会呈现。您可以 系统可能会显示“Load denied by X-Frame-Options”或“已拒绝显示”中的消息 (当未定义来源字段时)。

编码后的 JWT 应与以下示例类似:

eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJnb29nbGUiLCJvcmlnaW5zIjpbImh0dHA6Ly9sb2NhbGhvc3Q6ODA4MCIsImh0dHA6Ly93d3cuZ29vZ2xlLmNvbSJdLCJpc3MiOiJzMmFwLXRvb2wuZ29vZ2xlLmNvbUBhcHBzcG90LmdzZXJ2aWNlYWNjb3VudC5jb20iLCJpYXQiOjE1NTE5ODcxNTEsInR5cCI6InNhdmV0b3dhbGxldCIsInBheWxvYWQiOnsib2ZmZXJPYmplY3RzIjpbeyJpZCI6IjMyMDI0MTMyNDE4NDM2OTk0MDEuMDFfT2ZmZXJPYmplY3RJZCJ9XX19.maHX40WWT29TC_kEb90EKQBH9AiTYAZR3153K8UI7fznVnfjVdlwsH_GKTECV3PGXdNnKCcmatUbKsONC0bxrnAHYG02kuvA1D3hSctz_amU66ntsvGIDe13mpxTzhI8fPvt9KMP1iaO7uOJuLQIHwipu4uRFAjyFaHGVaSFaP9c53qQyb_Zgyyk50M-MhH2n4kDpstNCqUJKWaadQkOWjrtMjwGzQ_ME04lbR4wb_mfK1A7Rc1UieWkxM9aMl5TOPubBKxKRRk_CqillN8XoTl9MI5RRGPuElVO28zGpYlFS6BarzDaaUfmbRZGvfF8ZiKrHZKxVrJjfZIJ2TCcDw

gapi.savetoandroidpay.render 函数

此函数可让您显式呈现 Google Wallet API 按钮。

gapi.savetoandroidpay.render("dom-container",{
  "jwt": "JWT",
  "onsuccess": "successHandler",
  "onfailure": "failureHandler"
});
字段 类型 必需 说明
dom-container 字符串 是 用于放置 Google Wallet API 按钮的容器的 ID。
jwt 字符串 是 定义要保存的内容的 JWT。
onsuccess 字符串 否 保存成功回调处理程序函数的字符串名称。
onfailure 字符串 否 保存失败回调处理程序函数的字符串名称。系统会向此函数传递 包含 errorCode 和 errorMessage 的错误对象。
onprovidejwt 字符串 否 提供的 JWT 处理程序函数的字符串名称。该函数的用途是 在将对象添加到 Google 钱包之前,拦截 JWT 数据并可能操纵这些数据。 此函数不接受任何参数,并且必须以字符串形式返回 JWT。 在实现事件处理脚本时,可以检索原始 JWT 数据 在字段 this.getOpenParams().renderData.userParams.jwt 下。

Google Wallet API 错误代码和消息

下表列出了错误中传递的错误代码和默认错误消息 对象传递给失败回调函数。

        {
          "errorCode": "errorCode",
          "errorMessage": "errorMessage"
        }
errorCode errorMessage
SERVICE_FAILURE Google 电子钱包服务器上发生错误。
CLASS_NOT_FOUND 找不到对象中引用的类。
CLASS_MISMATCH 必须存在相同类型的对象,并且对象必须引用封闭的类。
ORIGIN_MISMATCH 按钮的来源与来源列表中指定的来源不匹配。
INVALID_NUM_TYPES 只能指定一种类型的对象。
INVALID_SIGNATURE 无法验证签名。
INVALID_DUPLICATE_IDS 不允许使用重复的对象或类。
INVALID_JWT JWT 无效。
INVALID_EXP_IAT JWT 已过期或是在将来签发。
INVALID_AUD AUD 字段的值无效。
INVALID_TYP TYP 字段的值无效。
INVALID_NUM_OBJECTS 对于会员卡、礼品卡和优惠,只能指定一个对象,并且最多只能指定一个类。
MALFORMED_ORIGIN_URL 来源网址格式错误。网址必须包含协议和域名。
MISSING_ORIGIN 必须指定来源。
MISSING_FIELDS 封闭的对象或类缺少必填字段。

本地化

JavaScript 按钮中的语言根据以下条件而变化:

  1. 如果用户已登录 Google,则该按钮会以 用户的 Google 账号个人资料。 用户可以读取 更改语言 ,了解如何更改 Google 账号的首选语言。
  2. 如果用户未登录 Google,该按钮将使用 ACCEPT-LANGUAGE 值 。

如果您发现按钮没有按照上述逻辑以正确的语言呈现,或者 措辞不自然 与我们的支持团队联系。