ログイン機能を作るときパスワードの再設定などが大変になるので、Googleのログイン機能を使う。
ゴール
こんな感じのボタンを表示してGoogleアカウントでログインできるようにする。
やること
Google Cloud Platformの登録
GCPのコンソールを開いてプロジェクトを選択する。
APIとサービス => 認証情報 => 同意画面を設定 => 外部
認証情報を作成 => OAuthクライアントID => ウェブアプリケーションを選択して作成する。
承認済みの JavaScript 生成元はhttp://localhost:3001と本番環境のドメイン名(https://example.com)を指定する。※localhostを使う場合はポートなしのhttp://localhostも登録する必要がある。
承認済みのリダイレクト URIはコールバック用のURIを設定する。例) http://localhost:3001/google_login_api/callback, https://example.com/google_login_api/callback
client_idとclient_secretを保存する。jsonでダウンロードしておくと良い。
Railsの実装
googleauthをgem installする。
ログイン画面の作成
公式サイトで説明されている通りコードをコピペしてclient_idとendpointを設定する。
<html>
<body>
<script src="https://accounts.google.com/gsi/client" async></script>
<div id="g_id_onload"
data-client_id="YOUR_GOOGLE_CLIENT_ID"
data-login_uri="https://your.domain/your_login_endpoint"
data-auto_prompt="false">
</div>
<div class="g_id_signin"
data-type="standard"
data-size="large"
data-theme="outline"
data-text="sign_in_with"
data-shape="rectangular"
data-logo_alignment="left">
</div>
<body>
</html>
コメント