️ 플러그인 버전 6.0.0부터 필요한 최소 cordova-ios 버전은 4.5.0입니다. 더 낮은 cordova-ios 버전을 사용해야 합니까? 플러그인 버전 5.3.2 이하를 사용하세요.
idToken
교환serverAuthCode
교환이 플러그인을 사용하면 iOS 및 Android에서 Google 로그인으로 사용자를 인증하고 식별할 수 있습니다. 기본적으로 이메일, 표시 이름, 이름, 성, 프로필 사진 URL 및 사용자 ID가 제공됩니다. idToken 및 serverAuthCode를 가져오도록 구성할 수도 있습니다.
이 플러그인은 Google 로그인 API에 대한 액세스만 래핑합니다. 추가 API 액세스는 개발자별로 사용 사례별로 구현되어야 합니다.
기계적 인조 인간
iOS
Google과 통신하려면 몇 가지 지루한 설정을 수행해야 합니다. 죄송합니다.
iOS와 Android 모두에 동일한 프로젝트를 사용하는 것이 (강력히) 권장됩니다.
config.xml
로 가서 패키지 이름(예: 앱 ID)이 원하는 것인지 확인하세요. 다음 단계에서 iOS 및 Android를 설정할 때 이 패키지 이름을 사용하세요! 그렇지 않으면 로그인 프로세스를 취소하지 않았음에도 불구하고 12501, '사용자 취소됨' 오류가 발생할 가능성이 높습니다.
이 단계는 Ionic과 같은 프레임워크를 사용하여 프로젝트를 구성하는 경우 특히 중요합니다. 프로젝트를 생성할 때 config.xml
com.ionic.*과 같은 자리 표시자 패키지 이름이 있으므로 즉시 개발을 시작할 수 있습니다.
xml version = ' 1.0 ' encoding = ' utf-8 ' ?>
< widget id = " ** REPLACE THIS VALUE ** " ...>
...
widget >
브라우저 플랫폼에는 Google 개발자 콘솔에서 생성된 유효한 WEB_APPLICATION_CLIENT_ID
가 필요합니다. 승인된 JavaScript 원본 섹션에 URL 주소(예: http://localhost:3000
)를 추가했는지 확인하세요. 예를 들어 이 스크린샷을 참조하세요.
iOS REVERSED_CLIENT_ID
얻으려면 여기에서 구성 파일을 생성하세요. 이 GoogleService-Info.plist
파일에는 설치 중에 필요한 REVERSED_CLIENT_ID
포함되어 있습니다. 이 값은 iOS에만 필요합니다.
REVERSED_CLIENT_ID
는 개발자 콘솔에서 'iOS URL 체계'라고도 합니다.
iOS에 로그인하면 별도의 Safari 브라우저 대신 Google SDK를 통해 SafariViewController로 사용자가 이동합니다.
Android를 구성하려면 여기에서 구성 파일을 생성하세요. Google 로그인을 활성화하고 Android 앱을 추가하여 SHA1 지문을 추가하세요. Google 로그인이 활성화되면 Google은 웹 및 Android용 개발자 콘솔에 필요한 자격 증명을 자동으로 생성합니다. 생성된 google-services.json 파일을 Cordova 프로젝트에 추가할 필요가 없습니다. 동의 화면을 구성해야 할 수도 있습니다.
여기에 설명된 대로 keytool
단계를 실행해야 합니다. 그렇지 않으면 인증이 실패합니다(릴리스 및 디버그 키 저장소 모두에 대해 이 작업을 수행).
중요한:
keytool
에 대한 위의 단계에서는 릴리스 와 디버그라는 두 가지 유형의 인증서 지문이 표시됩니다. 구성 파일을 생성할 때 디버그 인증서 지문을 사용하는 것이 더 좋으며, 그 후에는 Google 자격 증명 관리자로 이동하여 수동으로 생성해야 합니다. 릴리스 인증서 지문이 포함된 OAuth2 클라이언트 에 대한 자격 증명. 이는 개발 및 프로덕션 릴리스 모두에서 애플리케이션 작업에 필요합니다. $ keytool -exportcert -keystore -list -v -alias
Android에서 로그인하면 사용자 기기에 로그인된 계정이 사용됩니다.
Google Play 서비스 버전을 설정하려면 PLAY_SERVICES_VERSION 매개변수(기본값은 11.8.0)를 사용할 수 있습니다. 다른 버전의 Google Play 서비스를 사용하는 다른 플러그인과의 충돌을 피하는 데 유용합니다. 왜냐하면 동일한 버전이어야 하기 때문입니다.
Google은 Play 스토어에 앱을 게시할 때 다른 인증서로 앱에 다시 서명합니다. 앱이 게시되면 Google Play Console의 '출시 관리' 아래 '앱 서명' 섹션에 있는 '앱 서명 인증서'의 SHA-1 지문을 복사하세요. Google Credentials Manager의 Release OAuth 클라이언트 ID에 이 지문을 붙여넣으세요.
로그인 프로세스에서 idToken
또는 serverAuthCode
다시 가져오려면 프로젝트의 웹 애플리케이션에 대한 클라이언트 ID를 전달해야 합니다. 이는 Google 개발자 콘솔에 있는 프로젝트의 API 자격 증명 페이지에서 찾을 수 있습니다.
이 플러그인은 다음과 호환됩니다:
작동 방식은 다음과 같습니다(먼저 프로젝트를 백업하세요!).
Cordova CLI 및 npm 사용:
$ cordova plugin add cordova-plugin-googleplus --save --variable REVERSED_CLIENT_ID=myreversedclientid --variable WEB_APPLICATION_CLIENT_ID=mywebapplicationclientid
$ cordova prepare
Cordova CLI를 사용하여 GitHub에서 최신 버전을 가져옵니다.
$ cordova plugin add https://github.com/EddyVerbruggen/cordova-plugin-googleplus --save --variable REVERSED_CLIENT_ID=myreversedclientid --variable WEB_APPLICATION_CLIENT_ID=mywebapplicationclientid
$ cordova prepare
중요한:
myreversedclientid
는 iOS 구성 파일에서 찾을 수 있는 역방향 clientId의 자리 표시자입니다. 이 값을 따옴표로 묶지 마십시오. (iOS 전용 애플리케이션)
하이브리드 애플리케이션 (iOS 및 Android) 또는 Android 애플리케이션을 구축하는 경우 myreversedclientid
Google 개발자 콘솔의 3단계에서 생성된 릴리스 자격 증명의 클라이언트 ID 역방향 값으로 바꿔야 합니다. "com uniqueId
" , 따옴표 없이. 예: '123-abc123.apps.googleusercontent.com'은 'com.googleusercontent.apps.123-abc123'이 됩니다.
myreversedclientid
는 Google 개발자 콘솔의 웹 애플리케이션용으로 특별히 생성된 Oauth 클라이언트 ID의 자리 표시자입니다.
GooglePlus.js가 자동으로 가져옵니다. HTML에 아무것도 변경하거나 추가할 필요가 없습니다.
config.xml에 다음을 추가하세요.
(안정적인) NPM 버전의 경우:
< plugin name = " cordova-plugin-googleplus " source = " npm " >
< variable name = " REVERSED_CLIENT_ID " value = " myreversedclientid " />
< variable name = " WEB_APPLICATION_CLIENT_ID " value = " mywebapplicationclientid " />
plugin >
Git의 최신 버전(권장되지 않음):
< plugin spec = " https://github.com/EddyVerbruggen/cordova-plugin-googleplus.git " source = " git " >
< variable name = " REVERSED_CLIENT_ID " value = " myreversedclientid " />
< variable name = " WEB_APPLICATION_CLIENT_ID " value = " mywebapplicationclientid " />
< plugin >
이 플러그인은 iOS Google SignIn SDK 라이브러리 종속성을 충족하기 위해 CocoaPods 종속성 관리자를 사용합니다.
따라서 iOS 빌드 환경에 Cocoapods가 설치되어 있는지 확인하세요. 설정 지침은 여기에서 찾을 수 있습니다. 또한 pod repo update
실행하여 로컬 Cocoapods 저장소가 최신 상태인지 확인하세요.
Xcode에서 프로젝트를 빌드하는 경우 Cordova 앱 프로젝트와 Pods 프로젝트가 모두 Xcode에 로드되도록 YourProject.xcworkspace
( YourProject.xcodeproj
아님)를 열어야 합니다.
cocoapods-dependent를 설치하여 Cordova iOS 프로젝트의 Pod 종속성을 나열할 수 있습니다.
sudo gem install cocoapods-dependencies
cd platforms/ios/
pod dependencies
빨리 진행하려면 데모 앱을 확인하세요. 그렇지 않으면 다칠 수도 있으니 다음 단계를 따르세요.
deviceready
실행되기 전에는 이러한 메소드를 호출해서는 안 됩니다.
예:
document . addEventListener ( 'deviceready' , deviceReady , false ) ;
function deviceReady ( ) {
//I get called when everything's ready for the plugin to be called!
console . log ( 'Device is ready!' ) ;
window . plugins . googleplus . trySilentLogin ( ... ) ;
}
2016년 3월 31일: 이 방법은 더 이상 먼저 확인할 필요가 없습니다. 코드 직교성을 위해 유지됩니다.
로그인 기능은 사용자에게 Google 인증 프로세스를 안내합니다. 모든 매개변수는 선택사항이지만 몇 가지 주의사항이 있습니다.
Android에서 idToken
얻으려면 webClientId
전달 해야 합니다 (자주 발생하는 실수는 Android 클라이언트 ID를 제공하는 것입니다). iOS에서는 기본적으로 로그인 결과에 idToken
이 포함됩니다.
serverAuthCode
를 얻으려면 webClientId
전달 하고 offline
true로 설정해야 합니다. 오프라인이 true이지만 webClientId가 제공되지 않으면 serverAuthCode
요청되지 않습니다 .
요청되는 기본 범위는 profile
과 email
입니다(항상 요청됨). 다른 범위를 요청하려면 scopes
매개변수에 공백으로 구분된 목록 으로 추가하세요. 전달된 대로 정확하게 요청됩니다. 요청할 수 있는 유효한 범위에 대한 정보는 Google 범위 문서를 참조하세요. 예를 들어 'scope': 'https://www.googleapis.com/auth/youtube https://www.googleapis.com/auth/tasks'
.
당연히 추가 범위나 API를 사용하려면 프로젝트 개발자 콘솔에서 활성화해야 합니다.
window . plugins . googleplus . login (
{
'scopes' : '... ' , // optional, space-separated list of scopes, If not included or empty, defaults to `profile` and `email`.
'webClientId' : 'client id of the web app/server side' , // optional clientId of your Web application from Credentials settings of your project - On Android, this MUST be included to get an idToken. On iOS, it is not required.
'offline' : true // optional, but requires the webClientId - if set to true the plugin will also return a serverAuthCode, which can be used to grant offline access to a non-Google server
} ,
function ( obj ) {
alert ( JSON . stringify ( obj ) ) ; // do something useful instead of alerting
} ,
function ( msg ) {
alert ( 'error: ' + msg ) ;
}
) ;
성공 콜백(두 번째 인수)은 내 Google 계정의 예시 데이터와 함께 다음 내용이 포함된 JSON 개체를 가져옵니다.
obj . email // '[email protected]'
obj . userId // user id
obj . displayName // 'Eddy Verbruggen'
obj . familyName // 'Verbruggen'
obj . givenName // 'Eddy'
obj . imageUrl // 'http://link-to-my-profilepic.google.com'
obj . idToken // idToken that can be exchanged to verify user identity.
obj . serverAuthCode // Auth code that can be exchanged for an access token and refresh token for offline access
obj . accessToken // OAuth2 access token
사용 사례별로 추가 사용자 정보가 제공됩니다. 범위 옵션에 필요한 범위를 추가한 다음 각각 Android 및 iOS의 handleSignInResult
및 didSignInForUser
함수에서 생성되는 결과 개체에 정보를 반환합니다.
Android에서는 인증이 실패한 경우 오류 콜백(세 번째 인수)이 오류 상태 코드를 수신합니다. 해당 상태 코드에 대한 설명은 Google Android 개발자 웹사이트(GoogleSignInStatusCodes)에서 확인할 수 있습니다.
iOS에서는 오류 콜백에 NSError localizedDescription이 포함됩니다.
trySilentLogin
호출하여 이미 앱에 로그인되어 있는지 확인하고, 로그인되어 있으면 자동으로 로그인할 수 있습니다.
성공하면 login
기능이 가져오는 것과 동일한 개체를 얻게 되지만, 실패하면 사용자에게 인증 대화 상자가 표시되지 않습니다.
trySilentLogin
호출은 함수 이름을 제외하고 login
과 동일하게 수행됩니다.
window . plugins . googleplus . trySilentLogin (
{
'scopes' : '... ' , // optional - space-separated list of scopes, If not included or empty, defaults to `profile` and `email`.
'webClientId' : 'client id of the web app/server side' , // optional - clientId of your Web application from Credentials settings of your project - On Android, this MUST be included to get an idToken. On iOS, it is not required.
'offline' : true , // Optional, but requires the webClientId - if set to true the plugin will also return a serverAuthCode, which can be used to grant offline access to a non-Google server
} ,
function ( obj ) {
alert ( JSON . stringify ( obj ) ) ; // do something useful instead of alerting
} ,
function ( msg ) {
alert ( 'error: ' + msg ) ;
}
) ;
잠재적인 합병증을 방지하려면 로그인과 동일한 옵션을 사용하여 trySilentLogin을 구현하는 것이 좋습니다.
이렇게 하면 OAuth2 토큰이 지워집니다.
window . plugins . googleplus . logout (
function ( msg ) {
alert ( msg ) ; // do something useful instead of alerting
}
) ;
이렇게 하면 OAuth2 토큰이 지워지고 로그인에 사용된 계정이 기억나지 않으며 앱에서 해당 계정의 연결이 끊어집니다. 이렇게 하려면 사용자가 다음에 로그인할 때 앱 액세스를 다시 허용해야 합니다. 이 효과가 항상 즉시 나타나는 것은 아닙니다. 완전히 연결이 끊어지는 데 시간이 걸릴 수 있습니다.
window . plugins . googleplus . disconnect (
function ( msg ) {
alert ( msg ) ; // do something useful instead of alerting
}
) ;
idToken
교환백엔드 서버 인증에 대한 Google 문서
위 기사에서 언급했듯이 idToken
은 사용자 신원을 확인하기 위해 사용자 정보로 교환될 수 있습니다.
참고: Google은 사용자 ID 데이터가 서버로 직접 전송되는 것을 원하지 않습니다. idToken은 압축을 풀기 위해 서버를 통해 확인해야 하므로 해당 데이터를 안전하고 안전하게 전송하기 위해 선호하는 방법입니다.
여기에는 여러 가지 용도가 있습니다. 클라이언트 측에서는 사용자 신원을 이중으로 확인하는 방법이 될 수도 있고 이메일 호스트 도메인과 같은 세부 정보를 얻는 데 사용될 수도 있습니다. 서버 측은 idToken
이 실제로 큰 발전을 이루는 곳입니다. 이는 해당 서버 리소스에 대한 액세스를 허용하기 전이나 액세스 및 새로 고침 토큰을 위해 serverAuthCode
교환하기 전에 사용자 신원을 확인하는 쉬운 방법입니다(다음 섹션 참조).
서버 측에 추가 계정 액세스가 아닌 ID만 필요한 경우 해당 정보를 제공하는 안전하고 간단한 방법입니다.
serverAuthCode
교환서버 측 액세스 활성화에 대한 Google 문서
위 기사에서 언급했듯이 serverAuthCode
는 액세스 및 새로 고침 토큰으로 교환할 수 있는 항목입니다. idToken
과 달리 이를 통해 서버 측에서 사용자 Google 계정에 직접 액세스할 수 있습니다.
초기 로그인 요청에서만 serverAuthCode
반환됩니다. 토큰을 두 번째로 받으려면 먼저 로그아웃을 사용하면 됩니다.
이 교환에는 몇 가지 옵션이 있습니다. Google REST API를 사용하여 하이브리드 앱 자체에서 가져오거나 필요한 방법을 사용하여 코드를 백엔드 서버로 보내 그곳에서 교환할 수 있습니다(Google에서는 예제 제공) Java, Python 및 JS/HTTP의 경우).
앞서 언급했듯이 이 플러그인은 사용자 인증 및 신원 확인에 관한 것이므로 그 이상의 사용자 계정 사용은 사용 사례별, 애플리케이션별로 구현해야 합니다.
Q: Android에서 인증을 받을 수 없습니다. 그리고 왜 ANDROID API KEY가 없나요?
A: Android에서는 keytool
단계를 실행해야 합니다. 자세한 내용은 설치 지침을 참조하세요.
Q: keytool
단계를 따른 후에도 여전히 Android에서 작동하도록 인증을 받을 수 없습니다. "10 오류"가 발생했습니다!!!
A: APK 파일에서 SHA 1 인증서를 가져와야 합니다. keytool -list -printcert -jarfile
실행하고 SHA 1을 Google 콘솔의 Android 클라이언트 ID에 복사하세요.
질문: 맙소사 $@#*! Android 빌드가 실패하고 있습니다.
A: Android SDK 관리자에 Android 지원 리포지토리 와 Android 지원 라이브러리가 설치되어 있어야 합니다. 상당히 최신 버전을 사용하고 있는지 확인하세요.
Q: 내 Android 에뮬레이터에서는 왜 이 기능이 작동하지 않나요???
A: Google API 타겟 및/또는 Google API CPU 로 실행되는 가상 장치를 사용하고 있는지 확인하세요!
Q: 오류 10이 발생합니다. 어떻게 해야 합니까?
A: 이는 사용하려는 키 저장소를 사용하지 않는 cordova로 인해 발생할 수 있습니다(예: 직접 생성한 경우). 이 작업을 수행하는 방법을 알아보려면 https://cordova.apache.org/docs/en/latest/guide/platforms/android/#signing-an-app을 확인하세요. 일부에서는 오류 10을 해결하려면 빌드를 실행하기 전에 cordova clean
실행해야 한다고 보고했습니다.
Q: 오류 16이 발생합니다. 어떻게 해야 합니까?
A: 서명된 Android 앱의 서명(또는 지문)이 Google 콘솔(또는 Firebase) OAuth 화이트리스트에 추가되지 않기 때문에 이는 항상 문제가 됩니다. 이에 필요한 모든 작업을 수행했는지 다시 확인하세요. 아래의 미니 가이드를 참조하세요.
먼저, 안드로이드 문서에서 앱 서명에 대한 가이드를 완전히 읽고 이해했는지 확인하세요!
읽은 후 아래의 1~4단계를 모두 올바르게 수행했는지 다시 확인하세요.
앱에 서명하려면(개발 또는 게시 시) Android Studio 또는 터미널을 통해 로컬 키 저장소와 키를 만들어야 합니다. Google에는 서버에 키를 보관하고 앱에 서명하는 'Google Play 앱 서명'이라는 기능이 있지만, 이 기능을 사용하거나 사용하지 않으면 어느 쪽이든 로컬 키 저장소와 키가 필요합니다.
로컬 키스토어와 키가 공식 앱 서명 키가 됩니다.
Google OAuth 설정에서 다음 키 지문(SHA1 형식)을 허용 목록에 추가해야 합니다.
debug.keystore
키로컬 키스토어와 키가 '업로드 키'가 되며, 공식 '앱 서명 키'를 위한 또 다른 키가 Google에서 생성 및 관리됩니다.
Google Oauth 설정에서 다음 키 지문(SHA1 형식)을 허용 목록에 추가해야 합니다.
debug.keystore
키위 키의 지문(SHA1 형식)을 가져와 화이트리스트에 추가하세요.
안드로이드 기본 debug.keystore
의 경우 다음을 수행하십시오.
keytool -exportcert -keystore /Users/myusername/.android/debug.keystore -list -v
터미널에 디버그 키에 대한 SHA1 지문이 표시됩니다. 복사하세요.
키가 포함된 자체 생성된 키 저장소(2A 또는 2B용)의 경우 다음을 수행합니다.
keytool -exportcert -keystore /path/to/your/key/yourKeystoreFile.keystore -list -v
터미널에 디버그 키에 대한 SHA1 지문이 표시됩니다. 복사하세요.
Google Play 앱 서명이 활성화된 경우에만(2B의 경우) Google Play Console에서 Google이 빌드에 서명하는 데 사용할 키를 찾을 수 있습니다.
요구 사항: Android 앱의 기본 정보를 완료한 다음 내부 테스트를 위해 서명된 APK를 업로드해야 합니다. 업로드가 완료되면 다음 메뉴에 액세스할 수 있습니다.
릴리스 관리 > 앱 서명으로 이동합니다. 거기에서 당신은 볼 수 있습니다
"업로드"는 위의 키 B와 동일합니다. 그리고 '앱 서명 인증서'는 Google이 사용할 키입니다. 이것을 복사하세요.
이번에도 화이트리스트에 추가할 수 있는 2가지 옵션이 있습니다. Google Cloud Platform 만 사용하는 프로젝트 또는 Firebase를 사용하는 프로젝트입니다.
(Firebase를 함께 사용하시는 경우에는 이 단계를 건너뛰셔도 됩니다)