Google Wallet API를 사용하여 Android에서 패스 만들기

Google Wallet API를 사용하여 Android에서 패스 만들기

이 Codelab 정보

subject최종 업데이트: 1월 19, 2023
account_circle작성자: Nick Alteen

1. 소개

Google 월렛 API를 사용하면 포인트 카드, 혜택, 기프트 카드, 이벤트 티켓, 대중교통 티켓, 탑승권 등 다양한 유형의 패스를 통해 사용자와 소통하며 참여를 유도할 수 있습니다. 각 패스 유형 또는 패스 클래스에는 사용자 환경을 개선하기 위한 사용 사례별 필드와 기능이 있습니다.

하지만 이러한 방법이 모든 사용 사례에 적합하지는 않을 수 있습니다. 더 맞춤설정된 환경을 만들려면 일반 패스 유형을 사용하면 됩니다. 다음은 일반 패스 유형의 몇 가지 사용 사례입니다.

  • 주차권
  • 도서관 회원 카드
  • 금액이 저장된 쿠폰
  • 헬스장 회원 카드
  • 예약

일반 패스는 다음과 같이 표시할 수 있는 모든 사용 사례에 사용할 수 있습니다.

  • 정보 행 최대 3개
  • (선택사항) 바코드 그래픽
  • (선택사항) 세부정보 섹션

Google 월렛에 추가 프로비저닝 흐름을 보여주는 Android 지원 기기

Google Wallet API 또는 Android 애플리케이션에 Google 월렛에 추가 버튼을 추가하는 방법에 관한 자세한 내용은 Google 월렛 개발자 문서를 참고하세요.

클래스 및 객체 전달

Google Wallet API는 다음을 만드는 메서드를 노출합니다.

유형

설명

패스 클래스

개별 패스 객체의 템플릿입니다. 이 클래스에 속한 모든 패스 객체에 공통적인 정보가 포함됩니다.

객체 전달

사용자 ID에 고유한 패스 클래스의 인스턴스입니다.

이 Codelab 정보

이 Codelab에서는 다음 작업을 완료합니다.

  1. 데모 모드에서 새 발급기관 계정 만들기
  2. 패스 발급을 위한 서비스 계정 만들기
  3. 새 일반 패스 클래스 만들기
  4. 새 패스 객체 만들기
  5. Google 월렛에 추가 버튼을 만들어 패스를 저장합니다.
  6. Android 앱에 버튼 표시
  7. 패스 저장 결과 처리

기본 요건

목표

이 Codelab을 완료하면 다음을 수행할 수 있습니다.

  • Android 앱에 Google 월렛 SDK 추가
  • Android 지원 기기에서 Google 월렛 API를 사용할 수 있는지 확인
  • Google 월렛에 추가 버튼 만들기

지원

Codelab의 어느 단계에서든 문제가 발생하면 google-pay/wallet-android-codelab GitHub 저장소에서 참고할 수 있는 전체 솔루션을 확인하세요.

2. 설정

이 단계에서는 데모 모드에서 발급기관 계정을 만듭니다. 이렇게 하면 사용자 지갑에 추가할 수 있는 패스 클래스와 객체를 만들 수 있습니다. 다음으로 Google Cloud 프로젝트와 서비스 계정을 만듭니다. 이는 백엔드 서버와 동일한 방식으로 패스 클래스와 객체를 프로그래매틱 방식으로 만드는 데 사용됩니다. 마지막으로 Google Cloud 서비스 계정이 Google 월렛 발급자 계정에서 패스를 관리하도록 승인합니다.

Google Wallet API 발급기관 계정 가입

Google 월렛의 패스를 생성하고 배포하려면 발급자 계정이 필요합니다. Google Pay 및 월렛 콘솔을 사용하여 가입할 수 있습니다. 처음에는 데모 모드에서 패스를 만들 수 있습니다. 즉, 특정 테스트 사용자만 내가 만든 패스를 추가할 수 있습니다. 테스트 사용자는 Google Pay 및 월렛 콘솔에서 관리할 수 있습니다.

데모 모드에 관한 자세한 내용은 일반 패스 기본 요건을 참고하세요.

  1. Google Pay 및 월렛 콘솔을 엽니다.
  2. 화면에 표시된 안내에 따라 발급자 계정을 만듭니다.
  3. Google Wallet API를 선택합니다.
  4. 서비스 약관 및 개인정보처리방침을 이해했음을 확인합니다.
  5. 발급기관 ID 값을 텍스트 편집기 또는 다른 위치에 복사합니다.
  6. 관리 탭에서 테스트 계정 설정을 선택합니다.
  7. 이 Codelab에서 사용할 이메일 주소를 추가합니다.

Google Wallet API 사용 설정

  1. Google Cloud 콘솔에 로그인합니다.
  2. Google Cloud 프로젝트가 아직 없는 경우 지금 만드세요 (자세한 내용은 프로젝트 만들기 및 관리 참고).
  3. 프로젝트에 Google Wallet API (Google Pay for Passes API라고도 함)를 사용 설정합니다.

서비스 계정 및 키를 만듭니다.

Google 월렛 API를 호출하려면 서비스 계정과 서비스 계정 키가 필요합니다. 서비스 계정은 Google 월렛 API를 호출하는 ID입니다. 서비스 계정 키에는 애플리케이션을 서비스 계정으로 식별하는 비공개 키가 포함되어 있습니다. 이 키는 민감하므로 기밀로 유지하세요.

서비스 계정 만들기

  1. Google Cloud 콘솔에서 서비스 계정을 엽니다.
  2. 서비스 계정의 이름, ID, 설명을 입력합니다.
  3. 만들고 계속하기를 선택합니다.
  4. 완료를 선택합니다.

서비스 계정 키 만들기

  1. 서비스 계정 선택
  2. KEYS 메뉴를 선택합니다.
  3. 키 추가를 선택한 다음 새 키 만들기를 선택합니다.
  4. JSON 키 유형을 선택합니다.
  5. 만들기를 선택합니다.

키 파일을 로컬 워크스테이션에 저장하라는 메시지가 표시됩니다. 위치를 기억해 두세요.

GOOGLE_APPLICATION_CREDENTIALS 환경 변수를 설정합니다.

GOOGLE_APPLICATION_CREDENTIALS 환경 변수는 Google SDK에서 서비스 계정으로 인증하고 Google Cloud 프로젝트의 다양한 API에 액세스하는 데 사용됩니다.

  1. Google Cloud 서비스 계정 키 문서의 안내에 따라 GOOGLE_APPLICATION_CREDENTIALS 환경 변수를 설정합니다.
  2. 새 터미널 (macOS/Linux) 또는 명령줄 (Windows) 세션에서 환경 변수가 설정되어 있는지 확인합니다 (이미 세션이 열려 있는 경우 새 세션을 시작해야 할 수 있음).
    echo $GOOGLE_APPLICATION_CREDENTIALS

서비스 계정 승인

마지막으로 서비스 계정이 Google 월렛 패스를 관리하도록 승인해야 합니다.

  1. Google Pay 및 월렛 콘솔을 엽니다.
  2. 사용자를 선택합니다.
  3. 사용자 초대를 선택합니다.
  4. 서비스 계정의 이메일 주소를 입력합니다 (예: test-svc@myproject.iam.gserviceaccount.com).
  5. 액세스 수준 드롭다운 메뉴에서 개발자 또는 관리자를 선택합니다.
  6. 초대를 선택합니다.

3. 일반 패스 클래스 만들기

이 단계에서는 패스의 기본 클래스를 만듭니다. 사용자에 대해 새 패스가 생성될 때마다 패스 클래스에 정의된 속성이 상속됩니다.

이 Codelab에서 만들 패스 클래스는 일반 패스의 유연성을 사용하여 ID 배지와 챌린지 포인트 추적기 역할을 하는 객체를 만듭니다. 이 클래스에서 패스 객체가 생성되면 다음 그래픽과 같이 표시됩니다.

패스 클래스는 Google Pay 및 월렛 콘솔에서 직접 만들거나 Google Wallet API를 사용하여 만들 수 있습니다. 이 Codelab에서는 API를 사용하여 일반 패스 클래스를 만듭니다. 이는 비공개 백엔드 서버가 패스 클래스를 만드는 데 사용하는 프로세스를 따릅니다.

  1. google-pay/wallet-android-codelab GitHub 저장소를 로컬 워크스테이션에 클론합니다.
    git clone https://github.com/google-pay/wallet-android-codelab.git
  2. 터미널 또는 명령줄 프롬프트에서 클론된 저장소 열기
  3. backend 디렉터리로 이동합니다 (이 스크립트는 백엔드 서버 작업을 모방함).
    cd backend
  4. Node.js 종속 항목 설치
    npm install .
  5. backend 디렉터리에서 generic_class.js를 엽니다.
  6. issuerId 값을 Google Pay 및 월렛 콘솔의 발급기관 ID로 바꿉니다.
    // TODO: Define Issuer ID
    let issuerId = 'ISSUER_ID';
  7. 터미널 또는 명령줄 프롬프트에서 generic_class.js 스크립트를 실행합니다.
    node generic_class.js

코드가 실행되면 새 패스 클래스가 생성되고 클래스 ID가 출력됩니다. 클래스 ID는 발급기관 ID와 개발자가 정의한 접미사로 구성됩니다. 이 경우 접미사가 codelab_class로 설정됩니다 (클래스 ID는 1234123412341234123.codelab_class와 유사함). 출력 로그에는 Google Wallet API의 응답도 포함됩니다.

4. Android 스튜디오에서 프로젝트 열기

클론한 GitHub 저장소에는 빈 활동이 있는 Android 프로젝트가 포함되어 있습니다. 이 단계에서는 이 활동을 수정하여 제품 페이지에 Google 월렛에 추가 버튼을 포함합니다.

  1. Android 스튜디오 열기
  2. 파일을 선택한 다음 열기를 선택합니다.
  3. 저장소에서 android 디렉터리 선택
  4. 열기를 선택합니다.

앱에 Google 월렛 SDK 추가

  1. 모듈 수준 Gradle 빌드 파일 (android/app/build.gradle) 열기
  2. dependencies 섹션에 Google 월렛 SDK 추가
    // TODO: Add the "com.google.android.gms:play-services-pay" dependency to
    //       use the Google Wallet API
    implementation "com.google.android.gms:play-services-pay:16.0.3"
  3. 파일을 저장합니다.
  4. File(파일)을 선택한 다음 Sync Project with Gradle Files(Gradle 파일과 프로젝트 동기화)를 선택합니다.

5. Google 월렛에 추가 버튼 만들기

이 단계에서는 Google 월렛에 추가 버튼을 만들고 기존 활동에 추가합니다. 버튼의 애셋은 이미 프로젝트에 포함되어 있습니다. 버튼을 포함하려면 별도의 레이아웃 파일을 만듭니다. 추가하면 버튼이 다음과 같이 표시됩니다.

Google 월렛에 추가 버튼

  1. 새 레이아웃 파일(app/src/main/res/layout/add_to_google_wallet_button.xml)을 만듭니다.
  2. 새 레이아웃 파일에 다음 콘텐츠를 추가합니다.
    <?xml version="1.0" encoding="utf-8"?>
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="48sp"
        android:background="@drawable/add_to_google_wallet_button_background_shape"
        android:clickable="true"
        android:contentDescription="@string/add_to_google_wallet_button_content_description"
        android:focusable="true">
      <ImageView
          android:layout_width="227dp"
          android:layout_height="26dp"
          android:layout_gravity="center"
          android:duplicateParentState="true"
          android:src="@drawable/add_to_google_wallet_button_foreground" />
    </FrameLayout>
  3. 결제 활동 레이아웃 파일 (app/src/main/res/layout/activity_checkout.xml)에 add_to_google_wallet_button.xml 레이아웃 포함
    <!--
        TODO: Create the button under `add_to_google_wallet_button.xml`
              and include it in your UI
    -->
    <include
        android:id="@+id/addToGoogleWalletButton"
        layout="@layout/add_to_google_wallet_button"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_marginTop="10dp" />

6. Google Wallet API를 사용할 수 있는지 확인

사용자가 Google 월렛 API를 지원하지 않는 기기에서 앱을 열면 패스를 추가하려고 할 때 부정적인 환경이 조성될 수 있습니다. 사용자의 기기에서 Google 월렛 API를 지원하지 않는 경우 Google 월렛에 추가 버튼을 숨겨 혼란을 피할 수 있습니다. Android 또는 Google Play 서비스 버전이 오래되었거나 사용자의 국가에서 Google 월렛을 사용할 수 없는 등 다양한 이유로 API를 사용할 수 없을 수 있습니다.

이 단계에서는 기기에서 Google 월렛 API를 사용할 수 있는지 확인하는 로직을 앱에 추가합니다. 이 경우 버튼이 활동에 렌더링됩니다. 그렇지 않으면 버튼이 숨겨집니다.

  1. app/src/main/java/com/google/android/gms/samples/wallet/activity/에서 CheckoutActivity.kt 파일을 엽니다.
  2. PayClient 인스턴스의 클래스 속성 만들기
    // TODO: Create a client to interact with the Google Wallet API
    private lateinit var walletClient: PayClient
  3. onCreate 메서드에서 PayClient 속성 인스턴스화
    // TODO: Instantiate the client
    walletClient = Pay.getClient(this)
  4. 기기에서 Google 월렛 SDK 및 API를 사용할 수 있는지 확인하고 결과를 처리하는 메서드 만들기
    // TODO: Create a method to check for the Google Wallet SDK and API
    private fun fetchCanUseGoogleWalletApi() {
      walletClient
        .getPayApiAvailabilityStatus(PayClient.RequestType.SAVE_PASSES)
        .addOnSuccessListener { status ->
          if (status == PayApiAvailabilityStatus.AVAILABLE)
            layout.passContainer.visibility = View.VISIBLE
        }
        .addOnFailureListener {
          // Hide the button and optionally show an error message
        }
    }
  5. onCreate 메서드에서 fetchCanUseGoogleWalletApi 메서드를 호출하여 Google Wallet API를 사용할 수 있는지 확인합니다.
    // TODO: Check if the Google Wallet API is available
    fetchCanUseGoogleWalletApi()

앱을 실행하면 UI에 Google 월렛에 추가 버튼이 표시됩니다.

이제 앱 활동에 &#39;Google 월렛에 추가&#39; 버튼이 표시됩니다.

7. 일반 패스 객체 만들기

이제 Google 월렛 API를 사용할 수 있는지 확인했으므로 패스를 만들고 사용자에게 월렛에 패스를 추가하라는 메시지를 표시할 수 있습니다. 사용자의 패스 객체를 만드는 흐름에는 두 가지가 있습니다.

백엔드 서버에서 패스 객체 만들기

이 접근 방식에서는 패스 객체가 백엔드 서버에서 생성되고 서명된 JWT로 클라이언트 앱에 반환됩니다. 이는 사용자가 지갑에 카드를 추가하려고 시도하기 전에 카드가 존재하는지 확인할 수 있으므로 사용자 채택률이 높은 경우에 가장 적합합니다.

사용자가 월렛에 패스를 추가할 때 패스 객체 만들기

이 접근 방식에서는 패스 객체가 정의되고 백엔드 서버에서 서명된 JWT로 인코딩됩니다. 그러면 JWT를 참조하는 클라이언트 앱에 Google 월렛에 추가 버튼이 렌더링됩니다. 사용자가 버튼을 선택하면 JWT가 패스 객체를 만드는 데 사용됩니다. 패스 객체가 생성되지 않고 사용되지 않도록 하므로 사용자 채택이 가변적이거나 알 수 없는 경우에 가장 적합합니다. 이 접근 방식은 Codelab에서 사용됩니다.

  1. backend/generic_pass.js 파일을 엽니다.
  2. issuerId 값을 Google Pay 및 월렛 콘솔의 발급기관 ID로 바꿉니다.
    // TODO: Define Issuer ID
    let issuerId = 'ISSUER_ID';
  3. 터미널 또는 명령줄 프롬프트에서 generic_pass.js 파일을 실행합니다.
    node generic_pass.js
  4. 출력 토큰을 클립보드 또는 텍스트 편집기에 복사합니다.

코드가 실행되면 새 패스 객체를 정의하고 JWT에 삽입합니다. 그러면 이전에 만든 서비스 계정 키로 JWT가 서명됩니다. 이렇게 하면 사용자 인증 정보가 클라이언트 앱에 저장되지 않아도 되도록 Google 월렛 API에 대한 요청이 인증됩니다.

aside 프로덕션 환경에서는 백엔드 시스템이 JWT를 생성하고 클라이언트에 반환합니다. 이 Codelab에서는 generic_pass.js 스크립트가 이 동작을 에뮬레이션하고 클라이언트 앱에서 사용할 토큰을 '반환'합니다.

8. Google 월렛에 패스 추가

이제 Google 월렛 API를 사용할 수 있는지 확인하고 서명된 JWT를 만들었으므로 사용자에게 월렛에 패스를 추가하라는 메시지를 표시할 수 있습니다. 이 단계에서는 Google 월렛 API를 사용하여 사용자의 월렛에 패스를 저장하는 Google 월렛에 추가 버튼에 리스너를 추가합니다.

  1. app/src/main/CheckoutActivity.kt 파일을 엽니다.
  2. token 값을 이전에 만든 JWT로 바꿉니다.
    // TODO: Save the JWT from the backend "response"
    private val token = "TOKEN"
  3. 요청 코드를 저장할 클래스 속성 만들기
    // TODO: Add a request code for the save operation
    private val addToGoogleWalletRequestCode = 1000
  4. Google 월렛에 추가 버튼의 리스너 설정
    // TODO: Set an on-click listener on the "Add to Google Wallet" button
    addToGoogleWalletButton = layout.addToGoogleWalletButton.

    addToGoogleWalletButton.setOnClickListener {
      walletClient.savePassesJwt(token, this, addToGoogleWalletRequestCode)
    }

사용자가 Google 월렛에 추가 버튼을 선택하면 walletClient.savePassesJwt 메서드가 호출됩니다. 이 메서드는 사용자에게 Google 월렛에 새 패스 객체를 추가하라는 메시지를 표시합니다.

9. savePassesJwt 결과 처리

이 Codelab의 마지막 단계에서는 walletClient.savePassesJwt 작업의 결과를 처리하도록 앱을 구성합니다.

  1. app/src/main/CheckoutActivity.kt 파일을 엽니다.
  2. 다음 코드가 포함되도록 onActivityResult 메서드를 재정의합니다.
    // TODO: Handle the result
    override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
      super.onActivityResult(requestCode, resultCode, data)

      if (requestCode == addToGoogleWalletRequestCode) {
        when (resultCode) {
          RESULT_OK -> {
            // Pass saved successfully. Consider informing the user.
          }

          RESULT_CANCELED -> {
            // Save canceled
          }

          PayClient.SavePassesResult.SAVE_ERROR ->
            data?.let { intentData ->
              val errorMessage = intentData.getStringExtra(PayClient.EXTRA_API_ERROR_MESSAGE)
              // Handle error. Consider informing the user.
              Log.e("SavePassesResult", errorMessage.toString())
            }

          else -> {
            // Handle unexpected (non-API) exception
          }
        }
      }
    }

이제 앱에서 다음 시나리오를 처리할 수 있습니다.

  • 패스 추가 완료
  • 사용자 취소
  • 예상치 못한 오류

앱을 실행하여 패스를 추가하고 예상대로 결과를 처리할 수 있는지 확인합니다.

10. 축하합니다

일반 패스 객체의 예

축하합니다. Android에 Google Wallet API를 성공적으로 통합했습니다.

자세히 알아보기

google-pay/wallet-android-codelab GitHub 저장소에서 전체 통합을 살펴보세요.

패스 만들기 및 프로덕션 액세스 요청

프로덕션에서 자체 패스를 발급할 준비가 되면 Google Pay 및 월렛 콘솔로 이동하여 프로덕션 액세스를 요청하고 Android 앱을 승인합니다.

자세한 내용은 Android SDK 기본 요건을 참고하세요.