Google Wallet API를 사용하면 사용자가 웹에서 Google 월렛에 객체를 추가할 수 있습니다. 사용자가 웹사이트에서 직접 카드를 추가할 수 있습니다.
이 참조 자료에서는 HTML 요소 g:savetoandroidpay
에 대해
Google Wallet API 버튼을 렌더링합니다
JSON 웹 토큰
은 웹 서비스를 Google에 설명하는 데 사용됩니다.
Google Wallet API 자바스크립트
로드 시 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 |
문자열 | N | 표시할 버튼의 높이입니다. 가능한 값은 small (30px 높이) 및
standard (38픽셀 높이) height 의 기본값은 small 입니다.
Google Wallet API 버튼을 참고하세요.
height 설정이 다른 버튼 샘플을 확인합니다. |
jwt |
문자열 | Y | Google Wallet API JWT가 있습니다. |
onsuccess |
문자열 | N | 저장 성공 콜백 핸들러 함수의 문자열 이름입니다. |
onfailure |
문자열 | N | 저장 실패 콜백 핸들러 함수의 문자열 이름입니다. 이 함수에는 errorCode 및 errorMessage가 포함된 error 객체입니다. |
onprovidejwt |
문자열 | N | 제공하는 JWT 핸들러 함수의 문자열 이름입니다. 이 함수의 목적은
객체가 Google 월렛에 추가되기 전에 JWT 데이터를 가로채고 잠재적으로 조작할 수 있습니다.
이 함수는 매개변수를 사용하지 않으며 JWT를 문자열로 반환해야 합니다.
이벤트 핸들러를 구현할 때 원본 JWT 데이터를 가져올 수 있습니다.
this.getOpenParams().renderData.userParams.jwt 필드 아래 |
size |
문자열 | N | 표시할 버튼의 너비입니다. size 를 matchparent 로 설정할 수 있습니다.
너비가 상위 요소의 너비와 일치하도록 만듭니다. 또는 size 에서 나가기
정의되지 않은 경우 너비가 text 설정의 너비에 맞게 늘어납니다.
Google Wallet API 버튼을 참고하세요.
size 설정이 다른 버튼 샘플을 확인합니다. |
text |
문자열 | N | 지원 중단됨 |
textsize |
문자열 | N | textsize=large 가 지정되면 다음이 표시됩니다.
텍스트 크기가 급격히 커지고
버튼 크기(특수한 UI 요구사항이 있는 경우) |
theme |
문자열 | N | 표시할 버튼의 테마입니다. 가능한 값은 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 |
문자열 | Y | Google Cloud 서비스 계정에서 생성한 이메일 주소입니다. |
aud |
문자열 | Y | 잠재고객으로 이동합니다. Google Wallet API 객체의 대상은 항상
google |
typ |
문자열 | Y | JWT 유형입니다. Google Wallet API 객체의 대상은 항상
savetowallet |
iat |
정수 | Y | 에포크 이후 초 단위로 실행됩니다. |
payload |
객체 | Y | 페이로드 객체입니다. |
payload.eventTicketClasses |
배열 | N | 저장할 이벤트 티켓 클래스입니다. |
payload.eventTicketObjects |
배열 | N | 저장할 이벤트 티켓 객체입니다. |
payload.flightClasses |
배열 | N | 저장할 항공편 클래스입니다. |
payload.flightObjects |
배열 | N | 저장할 광고 게재 기간 객체입니다. |
payload.giftCardClasses |
배열 | N | 할인받을 기프트 카드 클래스 |
payload.giftCardObjects |
배열 | N | 저장할 기프트 카드 객체입니다. |
payload.loyaltyClasses |
배열 | N | 저장할 포인트 클래스입니다. |
payload.loyaltyObjects |
배열 | N | 저장할 포인트 객체입니다. |
payload.offerObjects |
배열 | N | 저장할 쿠폰 객체입니다. |
payload.offerClasses |
배열 | N | 저장할 쿠폰 클래스입니다. |
payload.transitObjects |
배열 | N | 저장할 대중교통 객체입니다. |
payload.transitClasses |
배열 | N | 저장할 대중교통 클래스입니다. |
origins |
배열 | Y | JWT 저장 기능을 승인할 도메인 배열입니다. Google Wallet API
origins 필드가 정의되지 않으면 버튼이 렌더링되지 않습니다. 다음과 같은 방법을 사용할 수 있습니다.
'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 |
문자열 | Y | Google Wallet API 버튼을 배치할 컨테이너의 ID입니다. |
jwt |
문자열 | Y | 저장할 콘텐츠를 정의하는 JWT입니다. |
onsuccess |
문자열 | N | 저장 성공 콜백 핸들러 함수의 문자열 이름입니다. |
onfailure |
문자열 | N | 저장 실패 콜백 핸들러 함수의 문자열 이름입니다. 이 함수에는 errorCode 및 errorMessage가 포함된 error 객체입니다. |
onprovidejwt |
문자열 | N | 제공하는 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 |
원본 URL의 형식이 잘못되었습니다. URL에는 프로토콜과 도메인이 포함되어야 합니다. |
MISSING_ORIGIN |
출처를 지정해야 합니다. |
MISSING_FIELDS |
포함된 객체 또는 클래스에 필수 필드가 누락되었습니다. |
현지화
JavaScript 버튼의 언어는 다음 기준에 따라 변경됩니다.
- 사용자가 Google에 로그인하면 버튼이 사용자의 Google 계정 프로필 사용자가 읽을 수 있는 콘텐츠는 언어 변경 Google 계정의 기본 언어를 변경하는 방법을 알아보세요.
- 사용자가 Google에 로그인하지 않은 경우 버튼에
ACCEPT-LANGUAGE
값이 사용됩니다. 가 HTTP 헤더에 있어야 합니다.
위의 로직에 따라 버튼이 올바른 언어로 렌더링되지 않거나 표현이 부자연스럽고 지원팀에 문의하세요.