TV 및 기기 용 Google 로그인

인터넷에 연결된 TV와 같이 입력 기능이 제한된 기기에서 사용자가 Google 계정으로 앱에 로그인하도록 허용 할 수 있습니다.

앱은 사용자에게 짧은 코드와 로그인 URL을 표시합니다. 그런 다음 사용자는 웹 브라우저에서 로그인 URL을 열고 코드를 입력 한 다음 앱에 사용자의 로그인 정보에 액세스 할 수있는 권한을 부여합니다. 마지막으로 앱이 확인을 받고 사용자가 로그인됩니다.

이 로그인 흐름을 사용하려면 앱이 다음 기준을 충족하는 기기에서 실행되어야합니다.

  • 장치는 사용자에 대한 지침과 함께 40 자 URL 및 15 자 사용자 코드를 표시 할 수 있어야합니다.
  • 장치가 인터넷에 연결되어 있어야합니다.

클라이언트 ID 및 클라이언트 암호 얻기

Google의 로그인 엔드 포인트에 요청하려면 앱에 OAuth 2.0 클라이언트 ID와 클라이언트 비밀번호가 필요합니다.

프로젝트의 클라이언트 ID와 클라이언트 비밀번호를 찾으려면 다음을 수행하세요.

  1. 기존 OAuth 2.0 자격증 명을 선택 하거나 자격증 명 페이지를 엽니 다.
  2. 아직 만들지 않았다면 자격 증명 만들기> OAuth 클라이언트 ID 를 클릭하고 자격 증명을 만드는 데 필요한 정보를 제공하여 프로젝트의 OAuth 2.0 자격 증명을 만듭니다 .
  3. OAuth 2.0 클라이언트 ID 섹션에서 클라이언트 ID 를 찾습니다. 자세한 내용은 클라이언트 ID를 클릭하세요.

새 클라이언트 ID를 만드는 경우 TV 및 제한된 입력 장치 애플리케이션 유형을 선택합니다.

사용자 코드 및 확인 URL 얻기

사용자가 Google 계정을 사용하여 로그인을 요청하면 HTTP POST 요청을 OAuth 2.0 기기 엔드 포인트 인 https://oauth2.googleapis.com/device/code 로 전송하여 사용자 코드와 확인 URL을 얻습니다. 클라이언트 ID와 요청에 필요한 범위 목록을 포함합니다. 사용자의 Google 계정으로 만 로그인하려면 profileemail 범위 만 요청 email . 또는 사용자를 대신하여 지원되는 API 를 호출 할 수있는 권한을 요청하려면 profileemail 범위 외에 필요한 범위를 요청하세요.

다음은 사용자 코드에 대한 예제 요청입니다.

POST /device/code HTTP/1.1
Host: oauth2.googleapis.com
Content-Type: application/x-www-form-urlencoded

client_id=CLIENT_ID&scope=email%20profile

curl 사용 :

curl -d "client_id=CLIENT_ID&scope=email profile" https://oauth2.googleapis.com/device/code

응답은 JSON 객체로 반환됩니다.

{
  "device_code" : "4/4-GMMhmHCXhWEzkobqIHGG_EnNYYsAkukHspeYUk9E8",
  "user_code" : "GQVQ-JKEC",
  "verification_url" : "https://www.google.com/device",
  "expires_in" : 1800,
  "interval" : 5
}

앱 표시 user_codeverification_url 동시에 사용자에게 값 및, 폴링 로그인 지정된에서 엔드 포인트 interval 에서 사용자가 로그인 또는 지정된 시간 할 때까지 expires_in 통과했다.

사용자 코드 및 확인 URL 표시

장치 끝점에서 사용자 코드와 확인 URL을받은 후이를 표시하고 사용자에게 URL을 열고 사용자 코드를 입력하도록 지시합니다.

의 값 verification_urluser_code 변경 될 수 있습니다. 다음 제한을 처리 할 수있는 방식으로 UI를 디자인하십시오.

  • user_codeW 크기의 문자를 처리 할 수있을만큼 넓은 필드에 표시되어야합니다.
  • verification_url 은 40 자 길이의 URL 문자열을 처리 할 수있을만큼 넓은 필드에 표시되어야합니다.

두 문자열 모두 US-ASCII 문자 세트의 인쇄 가능한 문자를 포함 할 수 있습니다.

user_code 문자열을 표시 할 때 어떤 식 으로든 문자열을 수정하지 마십시오 (예 : 대소 문자 변경 또는 다른 서식 지정 문자 삽입). 나중에 코드 형식이 변경되면 앱이 중단 될 수 있습니다.

원하는 경우 표시 목적으로 URL에서 스키마를 제거하여 verification_url 문자열을 수정할 수 있습니다. 이 경우 앱에서 "http"및 "https"변형을 모두 처리 할 수 ​​있는지 확인하십시오. 다른 방법으로 verification_url 문자열을 수정하지 마십시오.

사용자가 확인 URL로 이동하면 다음과 유사한 페이지가 표시됩니다.

코드를 입력하여 장치 연결

사용자가 사용자 코드를 입력하면 Google 로그인 사이트에 다음과 유사한 동의 화면이 표시됩니다.

장치 클라이언트에 대한 동의 화면 예

사용자가 허용을 클릭하면 앱에서 사용자를 식별하기위한 ID 토큰, Google API를 호출하기위한 액세스 토큰 및 새 토큰을 얻기위한 새로 고침 토큰을 얻을 수 있습니다.

ID 토큰 받기 및 토큰 새로 고침

앱에 사용자 코드와 확인 URL이 표시되면 기기 엔드 포인트에서받은 기기 코드로 토큰 엔드 포인트 ( https://oauth2.googleapis.com/token ) 폴링을 시작합니다. interval 값으로 지정된 interval 초)으로 토큰 엔드 포인트를 폴링하십시오.

다음은 예제 요청입니다.

POST /token HTTP/1.1
Host: oauth2.googleapis.com
Content-Type: application/x-www-form-urlencoded

client_id=CLIENT_ID&client_secret=CLIENT_SECRET&code=DEVICE_CODE&grant_type=http://oauth.net/grant_type/device/1.0

curl 사용 :

curl -d "client_id=CLIENT_ID&client_secret=CLIENT_SECRET&code=DEVICE_CODE&grant_type=http://oauth.net/grant_type/device/1.0" https://oauth2.googleapis.com/token

사용자가 아직 요청을 승인하지 않은 경우 응답은 다음과 같습니다.

{
  "error" : "authorization_pending"
}

앱은 interval 값을 초과하지 않는 속도로 이러한 요청을 반복해야 interval . 앱이 너무 빨리 폴링하는 경우 응답은 다음과 같습니다.

{
  "error" : "slow_down"
}

사용자가 로그인하고 요청한 범위에 대한 액세스 권한을 앱에 부여하면 앱의 다음 요청에 대한 응답에 ID 토큰, 액세스 토큰 및 새로 고침 토큰이 포함됩니다.

{
  "access_token" : "ya29.AHES6ZSuY8f6WFLswSv0HZLP2J4cCvFSj-8GiZM0Pr6cgXU",
  "token_type" : "Bearer",
  "expires_in" : 3600,
  "refresh_token" : "1/551G1yXUqgkDGnkfFk6ZbjMMMDIMxo3JFc8lY8CAR-Q",
  "id_token": "eyJhbGciOiJSUzI..."
}

이 응답을 받으면 앱에서 ID 토큰을 디코딩하여 로그인 한 사용자에 대한 기본 프로필 정보를 얻거나 ID 토큰을 앱의 백엔드 서버보내 서버 에 안전하게 인증 할 수 있습니다. 또한 앱은 액세스 토큰을 사용하여 사용자가 승인 한 Google API호출 할 수 있습니다.

ID 및 액세스 토큰은 수명이 제한되어 있습니다. 사용자가 토큰의 수명이 지나도 로그인 상태를 유지하려면 새로 고침 토큰을 저장하고이를 사용하여 새 토큰요청 합니다.

ID 토큰에서 사용자 프로필 정보 가져 오기

JWT 디코딩 라이브러리로 ID 토큰을 디코딩하여 로그인 한 사용자에 대한 프로필 정보를 가져올 수 있습니다. 예를 들어 Auth0 jwt-decode JavaScript 라이브러리를 사용합니다.

var user_profile = jwt_decode(id_token);

// The "sub" field is available on all ID tokens. This value is unique for each
// Google account and can be used to identify the user. (But do not send this
// value to your server; instead, send the whole ID token so its authenticity
// can be verified.)
var user_id = user_profile["sub"];

// These values are available when you request the "profile" and "email" scopes.
var user_email = user_profile["email"];
var email_verified = user_profile["email_verified"];
var user_name = user_profile["name"];
var user_photo_url = user_profile["picture"];
var user_given_name = user_profile["given_name"];
var user_family_name = user_profile["family_name"];
var user_locale = user_profile["locale"];

추가 정보