데스크톱 및 모바일 앱에 Google Picker 통합

이 문서에서는 Google Picker API를 사용하여 데스크톱 및 모바일 앱에 Google Picker를 통합하는 방법을 설명합니다.

Google Picker API를 사용하면 사용자가 Google Drive 파일을 선택하거나 업로드할 수 있습니다. 사용자는 데스크톱, 모바일 또는 웹 앱에 Drive 데이터에 액세스할 수 있는 권한을 부여하여 파일을 안전하고 승인된 방식으로 상호작용할 수 있습니다.

기능

Google Picker에는 다음과 같은 여러 기능이 있습니다.

  • Google Drive UI와 유사한 디자인
  • Drive 파일의 미리보기 및 썸네일 이미지를 보여주는 여러 뷰
  • 특정 파일 유형 (예: PDF 또는 이미지) 또는 특정 폴더만 표시하는 사전 필터링된 뷰
  • 사용자의 기본 브라우저의 새 탭 내에서 Google Picker로 리디렉션

Google Picker를 사용하여 파일을 선택하고 업로드할 수 있지만 사용자가 한 폴더에서 다른 폴더로 파일을 정리, 이동 또는 복사할 수는 없습니다. 파일을 관리하려면 Google Drive API 또는 Drive UI를 사용해야 합니다.

기본 요건

Google Picker를 사용하는 앱은 기존 서비스 약관을 모두 준수해야 합니다. 가장 중요한 것은 요청에서 자신을 올바르게 식별해야 한다는 것입니다.

Google Cloud 프로젝트도 있어야 합니다.

환경 설정

Google Picker API를 사용하려면 환경을 설정해야 합니다.

API 사용 설정

Google API를 사용하기 전에 Google Cloud 프로젝트에서 API를 사용 설정해야 합니다. 단일 Google Cloud 프로젝트에서 하나 이상의 API를 사용 설정할 수 있습니다.

  • Google Cloud 콘솔에서 Google Picker API를 사용 설정합니다.

    API 사용 설정

인증 및 승인 설정

최종 사용자를 인증하고 앱에서 사용자 데이터에 액세스하려면 OAuth 2.0 클라이언트 ID를 하나 이상 만들어야 합니다. 클라이언트 ID는 Google OAuth 서버에서 단일 앱을 식별하는 데 사용됩니다. 앱이 여러 플랫폼에서 실행되는 경우 각 플랫폼에 대해 별도의 클라이언트 ID를 만들어야 합니다.

데스크톱 앱의 사용자 인증 정보 승인

OAuth 2.0 클라이언트 ID를 만들려면 다음 단계를 따르세요.

  1. Google API 콘솔에서 메뉴 > Google Auth 플랫폼 > 클라이언트로 이동합니다.

    클라이언트로 이동

  2. 클라이언트 만들기 를 클릭합니다.
  3. 애플리케이션 유형 > 데스크톱 앱을 클릭합니다.
  4. 이름 필드에 사용자 인증 정보의 이름을 입력합니다. 이 이름은 Google API 콘솔에만 표시됩니다.
  5. 만들기 를 클릭합니다.

    새로 만든 사용자 인증 정보가 'OAuth 2.0 클라이언트 ID' 아래에 표시됩니다.

앱이 이전에 부여된 파일에 대한 승인을 받으려면 다음 단계를 따라야 합니다.

  1. OAuth 2.0을 사용하여 Google API에 액세스하기의 안내에 따라 drive.file, drive 또는 drive.readonly 범위로 OAuth 2.0 토큰을 가져와야 합니다. 범위에 대한 자세한 내용은 Google Drive API 범위 선택하기를 참고하세요.

  2. OAuth 2.0 토큰을 Drive API에 전달하여 사용자가 이전에 액세스 권한을 부여한 파일을 읽고 수정합니다.

모바일 앱의 사용자 인증 정보 승인

OAuth 2.0 클라이언트 ID를 만들려면 모바일 앱의 사용자 인증 정보 승인 의 단계를 따르세요.

웹 앱의 사용자 인증 정보 승인

OAuth 2.0 클라이언트 ID를 만들려면 웹 앱의 사용자 인증 정보 승인 의 단계를 따르세요.

Google Picker 표시

데스크톱 및 모바일 앱용 Google Picker API는 사용자의 기본 브라우저의 새 탭 내에서 Google Picker로 리디렉션됩니다. 사용자가 액세스 권한을 부여하고 관련 파일을 선택하면 Google Picker가 콜백 URL을 통해 호출 앱으로 돌아갑니다.

Google Picker API를 클라이언트 페이지에서 열려면 웹 앱용 Google Picker API를 대신 사용하세요. 자세한 내용은 웹 앱에 Google Picker 통합을 참고하세요.

사용자가 추가 파일에 대한 액세스 권한을 부여하거나 앱 흐름에서 사용할 파일을 선택하도록 허용하려면 다음 단계를 따르세요.

  1. OAuth 2.0을 사용하여 Google API에 액세스하기의 안내에 따라 새 브라우저 탭에서 OAuth 2.0 액세스 페이지 를 열려면 drive.file 범위에 대한 액세스 권한을 요청합니다. 범위에 대한 자세한 내용은 Google Drive API 범위 선택하기를 참고하세요.

    이러한 앱에는 drive.file 범위만 허용되며 다른 범위와 결합할 수 없습니다.

  2. 새 브라우저 탭의 URL은 모든 표준 OAuth 쿼리 문자열 매개변수를 허용합니다.

    OAuth 2.0 승인 URL 요청에 prompt 및 trigger_onepick URL 매개변수를 추가해야 합니다. 선택적으로 여러 다른 매개변수로 Google Picker를 맞춤설정할 수도 있습니다.

    매개변수 설명 상태
    prompt=consent 파일 액세스에 대한 메시지 표시 필수
    trigger_onepick=true Google Picker 사용 설정 필수
    allow_multiple=true true인 경우 사용자가 여러 파일을 선택할 수 있도록 허용합니다. 선택사항
    mimetypes=MIMETYPES 검색 결과를 필터링할 MIME 유형의 쉼표로 구분된 목록입니다. 설정하지 않으면 모든 MIME 유형의 파일이 뷰에 표시됩니다. 선택사항
    file_ids=FILE_IDS 검색 결과를 필터링할 파일 ID의 쉼표로 구분된 목록입니다. 설정하지 않으면 모든 파일이 뷰에 표시됩니다. 선택사항
    allow_folder_selection=true true인 경우 사용자가 폴더도 선택할 수 있도록 허용합니다. 선택사항

    다음 샘플은 OAuth 2.0 승인 URL 요청을 보여줍니다.

    https://accounts.google.com/o/oauth2/v2/auth? \
client_id=CLIENT_ID \
&scope=https://www.googleapis.com/auth/drive.file \
&redirect_uri=REDIRECT_URI \
&response_type=code \
&access_type=offline \
&prompt=consent \
&trigger_onepick=true

    다음을 바꿉니다.

    • CLIENT_ID: 앱의 클라이언트 ID입니다.

    • REDIRECT_URI: 인증이 완료된 후 승인 서버가 사용자 브라우저를 리디렉션하는 위치입니다. 예를 들어 https://www.cymbalgroup.com/oauth2callback입니다.

      지정된 redirect_uri는 공개 HTTPS URL이어야 합니다. redirect_uri에 커스텀 프로토콜 또는 localhost URL을 사용하려면 커스텀 프로토콜 또는 localhost URL로 리디렉션되는 공개 HTTPS URL을 사용해야 합니다.

  3. 사용자가 액세스 권한을 부여하고 관련 파일을 선택하면 OAuth가 요청에 지정된 redirect_uri로 리디렉션되고 다음 URL 매개변수가 추가됩니다.

    • picked_file_ids: 사용자가 액세스 권한을 부여하고 파일을 선택한 경우 선택한 파일 ID의 쉼표로 구분된 목록입니다.

    • code: 요청에 설정된 response_type 매개변수를 기반으로 하는 액세스 토큰 또는 액세스 코드입니다. 이 매개변수에는 새 승인 코드가 포함됩니다.

    • scope: 요청에 포함된 범위입니다.

    • error: 사용자가 동의 흐름 내에서 요청을 취소한 경우 오류가 표시됩니다.

    다음 샘플은 OAuth 2.0 승인 URL 응답을 보여줍니다.

    https://REDIRECT_URI?picked_file_ids=PICKED_FILE_IDS&code=CODE&scope=SCOPES

  4. 앱은 3단계의 승인 코드를 새 OAuth 2.0 토큰으로 교환해야 합니다. 자세한 내용은 갱신 및 액세스 토큰을 위한 승인 코드 교환을 참고하세요.

  5. 그런 다음 앱은 3단계의 URL 매개변수에서 파일 ID와 4단계에서 가져온 OAuth 2.0 토큰을 사용하여 Drive API를 호출할 수 있습니다. 자세한 내용은 Google Drive API 개요를 참고하세요.

Android 앱에서 Google Picker 사용

Android 모바일 앱에서 Google Picker를 사용할 수도 있습니다.

모바일 앱의 사용자 인증 정보 승인

Android 앱에서 Google Picker를 사용하려면 OAuth 2.0을 사용하여 사용자를 승인해야 합니다. 데스크톱 앱과 유사합니다. Android 인증에 관한 자세한 내용은 Google 사용자 데이터에 대한 액세스 승인 을 참고하세요.

승인 중에 Google Picker를 표시하려면 AuthorizationRequest 를 만들고 AuthorizationRequest.ResourceParameter 객체에서 PICKER_OAUTH_TRIGGER 리소스 매개변수를 사용합니다.

AuthorizationRequest를 빌드할 때 다음을 실행합니다.

  • drive.file 범위를 사용합니다.

  • 반환된 토큰이 이전에 부여된 범위가 아닌 drive.file 범위에만 적용되도록 하려면 setOptOutIncludingGrantedScopes 를 true로 호출합니다.

  • 사용자에게 동의를 요청하려면 AuthorizationRequest.Prompt 필드를 CONSENT로 설정합니다. 이전에 동의가 부여된 경우에도 마찬가지입니다.

  • 선택적으로 비트맵 'OR'(|) 연산자를 사용하여 AuthorizationRequest.Prompt 필드를 SELECT_ACCOUNT로 설정하여 동의 메시지가 표시되기 전에 사용자가 계정을 선택하도록 할 수도 있습니다.

Google Picker 호출

데스크톱 앱과 마찬가지로 여러 선택적 매개변수로 Google Picker를 맞춤설정할 수 있습니다.

  • PICKER_ALLOW_MULTIPLE: 사용자가 여러 파일을 선택할 수 있도록 허용합니다.
  • PICKER_MIMETYPES: 검색 결과를 필터링할 MIME 유형의 쉼표로 구분된 목록을 허용합니다. 설정하지 않으면 모든 MIME 유형의 파일이 뷰에 표시됩니다.
  • PICKER_FILE_IDS: 검색 결과를 필터링할 파일 ID의 쉼표로 구분된 목록을 허용합니다. 설정하지 않으면 모든 파일이 뷰에 표시됩니다.
  • PICKER_ALLOW_FOLDER_SELECTION: 사용자가 폴더도 선택할 수 있도록 허용합니다.

데스크톱 앱의 선택적 매개변수에 관한 자세한 내용은 Display the Google Picker를 참고하세요.

사용자가 액세스 권한을 부여하고 관련 파일을 선택하면 getTokenResponseParams 리소스의 AuthorizationResult 객체가 반환됩니다. 사용자가 액세스 권한을 부여한 경우 이 객체에는 선택한 파일 ID의 쉼표로 구분된 목록인 picked_file_ids 값이 포함됩니다.