web-dev-qa-db-ja.com

Google、Facebook、YahooなどのソーシャルログインサービスをWebサイトに追加する方法

Google、Facebookなどのサービスを使用してログインするオプションをユーザーに提供するために、Webサイトに次のボタンを追加したい.

Login Options

次の質問に答えてください。

  1. このようなさまざまなサービスを追加するにはどうすればよいですか無料？ （Janrainやのような有料サービスを使用したくないことに注意してください）
  2. アカウントに保存されているユーザーのユーザー情報（電子メール、電話番号など）をデータベースに保存するにはどうすればよいですか？
  3. 使用できるリンク/ライブラリを提供してください。

あなたが提供できる他の情報に感謝します。

ありがとうございました！

loginopenidsingle-sign-on
37
Sumit Gupta

それぞれのサービス（Google、Facebook、Twitter）のAPIを使用するか、それを追加する予定がある場合はOpenIDになる可能性があります。いくつかのリンク：

http://code.google.com/apis/accounts/docs/OpenID.html

https://developers.facebook.com/docs/authentication/

http://dev.Twitter.com/pages/auth

http://openid.net/add-openid/

こちら もご覧ください。 SOには既にいくつかの同様の質問があります。右側の関連する質問を確認してください。

33
Atul Goyal

google向け

GoogleサインインをWebアプリに統合する

Google Developers ConsoleプロジェクトとクライアントIDを作成します。

Googleプラットフォームライブラリを読み込む

Googleサインインを統合するWebページにGoogleプラットフォームライブラリを含める必要があります。

<script src="https://apis.google.com/js/platform.js" async defer></script>

アプリのクライアントIDを指定します

Google-signin-client_idメタ要素を使用して、Google Developers Consoleでアプリ用に作成したクライアントIDを指定します。

<meta name="google-signin-client_id" content="YOUR_CLIENT_ID.apps.googleusercontent.com">

注：gapi.auth2.init（）メソッドのclient_idパラメーターを使用して、アプリのクライアントIDを指定することもできます。

Googleサインインボタンを追加する

Googleサインインボタンをサイトに追加する最も簡単な方法は、自動的にレンダリングされるサインインボタンを使用することです。わずか数行のコードで、ユーザーのサインイン状態と要求するスコープに適切なテキスト、ロゴ、色を自動的に設定するボタンを追加できます。

デフォルト設定を使用するGoogleサインインボタンを作成するには、クラスg-signin2のdiv要素をサインインページに追加します。

<div class="g-signin2" data-onsuccess="onSignIn"></div>

その他の情報。見つかりました ここ

1
KhogaEslam