web-dev-qa-db-ja.com

Googleプラスからユーザーのメールを取得する方法oauth

リンク： https://sites.google.com/site/oauthgoog/Home/emaildisplayscope

上記のリンクから、メールスコープを追加します

https://www.googleapis.com/auth/plus.me
https://www.googleapis.com/auth/userinfo.email

しかし、私は以下を理解していない

有効なOAuthトークンを取得したら、それを使用してEmail Display APIエンドポイントへのAPI呼び出しを行うことができます。 https：// www .googleapis.com/userinfo/email トークンが有効でない場合、401エラーが返されます。トークンが有効な場合、ユーザーのメールアドレスが返されます。APIは、ユーザーがそのメールアドレスを所有していることをGoogleが確認したかどうか。ただし、ほとんどのインストール済みアプリケーションはその値を無視します。

Email Display APIエンドポイントを呼び出す方法は？ https://www.googleapis.com/userinfo/email を使用

google-plus
33
Marian Petrov

スコープを次のように設定します。

そしてエンドポイントを使用します：

https://www.googleapis.com/oauth2/v1/userinfo?alt=json

使用法：

get https://www.googleapis.com/oauth2/v1/userinfo?alt=json&access_token=youraccess_token

JSONを取得します。

{ "id": "xx", 
  "name": "xx", 
  "given_name": "xx", 
  "family_name": "xx", 
  "link": "xx", 
  "picture": "xx", 
  "gender": "xx", 
  "locale": "xx" 
}
52
Joseph Rajeev Motha

Google+サインインの範囲が変更されました。

スコープを次のように設定します。

https://www.googleapis.com/auth/plus.login
https://www.googleapis.com/auth/userinfo.email

JavaScript呼び出しは次のようになります。

gapi.client.load('oauth2', 'v2', function() {
  gapi.client.oauth2.userinfo.get().execute(function(resp) {
    // Shows user email
    console.log(resp.email);
  })
});

gapi.client.load('plus', 'v1', function() {
  gapi.client.plus.people.get( {'userId' : 'me'} ).execute(function(resp) {
    // Shows profile information
    console.log(resp);
  })
});

詳細 https://developers.google.com/+ 。

編集：plus.meまたはuserinfo.profileのスコープは必要ないことに注意してください。

34
Chris Cartland

Google+でGoogleAPIを使用するようになりました

2013年12月の時点で、ここに最新のWebサイトがあります。

https://developers.google.com/+/

次に、SignIn for Web

https://developers.google.com/+/web/signin/

サインインフローを選択する

->クライアント側フロー

->JavaScriptでサインインフローを開始します（これは最新のテクノロジーだと思います）

https://developers.google.com/+/web/signin/javascript-flow

JavaScriptを使用してGoogle+サインインフローを開始する

gapi.auth.signIn（）メソッドを使用して、Google +サインインフローを開始できます。この方法により、ユーザーにアプリとサインインを承認する方法とタイミングを柔軟に決定できます。

https://developers.google.com/+/web/api/javascript#gapiauthsigninparameters

gapi.auth.signIn（parameters）

クライアント側のGoogle+サインインを開始します。OAuth 2.0フロー。 Androidアプリのインストール。このメソッドは、Google +サインインボタンウィジェットを使用するJavaScriptの代替手段です。

https://developers.google.com/+/web/signin/javascript-flow

  • 試してみるgapi.auth.signIn（）でサインインフローをトリガーするページ

https://google-developers.appspot.com/+/demos/signin_demo_render （SourceCode）

あなたはこれを試して、あなた自身のために、従います

ステップ1：クライアントIDとクライアントシークレットを作成する

次の手順は無視してください。

実際には、clientIDのみが必要で、ソースコードのTry itを置き換えてください。

スコープを追加 https://www.googleapis.com/auth/userinfo.email

var options = {
  'callback': loginFinished,
  'approvalprompt': 'force',
  'clientid': 'YOURID.apps.googleusercontent.com',
  'scope': 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email',
  'requestvisibleactions': 'http://schemas.google.com/CommentActivity http://schemas.google.com/ReviewActivity',
  'cookiepolicy': 'single_Host_Origin'
};

追加する

gapi.client.load('oauth2', 'v2', function()
  {
    gapi.client.oauth2.userinfo.get()
      .execute(function(resp)
      {
        // Shows user email
        console.log(resp.email);
      });
  });

上記に基づいた完全に機能する簡潔なコードを次に示します。

<html>
<head>
  <title>Google+ Sign-in button demo: rendering with JavaScript</title>
  <style type="text/css">
  html, body { margin: 0; padding:0;}
  #signin-button {
   padding: 5px;
  }
  #oauth2-results pre { margin: 0; padding:0; width: 600px;}
  .hide { display: none;}
  .show { display: block;}
  </style>

  <script src="https://apis.google.com/js/client:platform.js" type="text/javascript"></script>
  <script type="text/javascript">
var loginFinished = function(authResult)
{
  if (authResult)
  {
    console.log(authResult);
  }

  gapi.client.load('oauth2', 'v2', function()
  {
    gapi.client.oauth2.userinfo.get()
      .execute(function(resp)
      {
        // Shows user email
        console.log(resp.email);
      });
  });

};

var options = {
  'callback': loginFinished,
  'approvalprompt': 'force',
  'clientid': 'YOURID.apps.googleusercontent.com',
  'scope': 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email',
  'requestvisibleactions': 'http://schemas.google.com/CommentActivity http://schemas.google.com/ReviewActivity',
  'cookiepolicy': 'single_Host_Origin'
};

var renderBtn = function()
{
  gapi.signin.render('renderMe', options);
}
  </script>

</head>
<body onload ="renderBtn()">
   <div id="renderMe"></div>  
</body>
</html>

HTML出力はありませんが、コンソールです。そのため、ブラウザのDevelopers Consoleツールを開いて結果を表示します。

17
user1028880

これは、angularjsでIonicフレームワークで行いましたが、動作します。これを試してください。

controller("OauthExample", function($scope, $cordovaOauth, $http) {

    $scope.googleLogin = function() {
        $cordovaOauth.google("YOUR CLIENTID", ["https://www.googleapis.com/auth/userinfo.email", "https://www.googleapis.com/auth/userinfo.profile"]).then(function(result) {
            window.localStorage.setItem("access_token", result.access_token);
            $scope.token=JSON.stringify(result);

        }, function(error) {
            console.log(error);
        });
    }


        $scope.getProfileInfo = function() {
            console.log(window.localStorage.getItem('access_token'));
        $http.defaults.headers.common.Authorization = "Bearer " + window.localStorage.getItem("access_token");
        $http.get("https://www.googleapis.com/oauth2/v1/userinfo?alt=json")
            .success(function(data) {
                console.log(data);
                console.log(data.email);
            })
            .error(function(error) {
                console.log(error);
            });
    }

});
1
Miguel Trevino