Googleアカウントを使ったログイン・サインアップ

GoogleのAPIを使用してログインするログイン機能があります。この機能を利用することで簡単にa-blog cmsへログインすることができる様になります。またサインアップ機能（読者登録）も対応していますので、読者登録を実装されている場合は有効なカスタマイズになります。

Google API Consoleでの設定

Googleアカウントを使ったログインのための準備として、a-blog cms の管理ページ＞コンフィグ＞ログイン設定 にあるGoogleの「Client ID」と「Secret Key」の2つの情報が必要になります。この2つの情報は、GoogleのOAuth クライアント IDを作成することで入手できます。

---

この手順は2023年10月現在のものです。Google側の仕様変更がされる場合がありますのでご注意ください。

1.Google API Console( https://console.developers.google.com/ )から、申請を行う必要があります。この時点でログインしているアカウントに関連づけられます。はじめにヘッダーの「プロジェクトを選択してください」から「プロジェクトの作成...」から新しいプロジェクトを作成を行います。

---

---

2.認証情報から認証情報作成を行います。左のAPI Managerから「認証情報」を選択します。「認証情報を作成」から「OAuth クライアント ID」を選択します。

• アプリケーションの種類: ウェブアプリケーション
• 承認済みの JavaScript 生成元: Googleアカウントでログインを行うサイトURL（http://www.example.com）を入力
• 承認済みのリダイレクト URI: 対象となるa-blog cmsのブログURL/callback/signin/google.html

作成すると、クライアントID と クライアントシークレット が表示されます。後で使うのでメモしておきましょう。また認証情報になりますので、外部にもれないように気をつけて下さい。

---

---

3.同意画面を設定します。認証情報 > OAuth同意画面から設定してください。サービス名は必須項目です。

---

---

a-blog cms 側の設定

Googleログインのためのa-blog cms側での設定は大きく3つあります。

1. 認証情報を登録

管理ページ > コンフィグ > ログイン設定 から設定できます。先ほどメモした「Client ID」 を Client IDに 「Client Secret」を Secret Keyに入力してください。

---

2. Googleログインのための設定

ブログ全体でのSNSログイン機能と対象についての設定は 管理ページ > コンフィグ > ログイン設定 から行います。

SNSログイン機能のチェックで該当ブログでの機能を有効化します。SNSログイン使用権限では、SNSログイン機能が使えるユーザー権限を設定します。

---

3. ユーザーごとの設定

「2. SNSログインのための設定」でブログでのSNSログイン機能を有効にすることで、該当ブログに所属する各ユーザーのプロフィール変更画面にSNSログインのための項目が表示されるようになります。

https://example.com/mypage/update-profile/

ログインした状態で認証（または認証解除）することで、ログイン情報とこのユーザーが関連づけされます。ログイン状態がユーザーに関連づけされますので、この設定は管理者が設定するのではなく、各ユーザーが個別に行うものとなります。

---

---

ログイン

ここまでの設定が行われていれば、ユーザーID、パスワードを入力しなくても、Googleのログインボタンからログインできるようになります。ログイン画面を表示すると、通常のユーザーID、パスワードの入力欄の下に、Googleのログインボタンが表示されます。

---