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

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

Twitter Application Managementの設定

Twitterアカウントを使ったSNSログインのための準備として、a-blog cms の 管理ページ>コンフィグ>プロパティ設定 にあるTwitter(SNSログイン用)欄の「Consumer Key」と「Consumer Secret」の2つの情報が必要になります。この2つの情報は、 独自のTwitterアプリを作成することで入手できます。

アプリの作成手順

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

  1. Twitter のアプリケーション登録ページ( https://apps.twitter.com )から、申請を行う必要があります。この時点でログインしているアカウントが表示や投稿に関連づけられます。画面右側の「Create New App」から新しいアプリケーションの作成を行います。

Twitter Application Managementの画面

Twitter Application Managementの画面


2.Application Detail の各欄を入力します。 Name、Descriptionにはわかりやすい名前と概要を入力し、Websiteには対象となるa-blog cmsのブログURLを入力してください。 Callback URLには以下の内容を入力してください。

対象となるa-blog cmsのブログURL/callback/signin/twitter.html

画面下部の規約に同意して登録を完了してください。


アプリケーション作成画面

アプリケーション作成画面


3.アプリケーションの作成が完了すると、情報の確認や設定の変更ができます。以下の内容を変更してください。

Application Settings内「Access level」

基本のアクセス形式です。 (modify app permissions)のリンクからデフォルトは「Read & Write」ですが、SNSログインは「Read only」で実行できます。


SNSログインは「Read only」で実行できます

SNSログインは「Read only」で実行できます


Keys and Access Tokens

a-blog cmsとの連携には、このタブで表示される「Consumer Key (API Key)」と「Consumer Secret (API Secret)」が必要になりますのでメモをしておいてください。


Keys and Access Tokensの画面

Keys and Access Tokensの画面


a-blog cms 側の設定

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

  • APIキーの設定
  • SNSログインのための設定
  • ユーザーごとの設定

1. APIキーを設定

Google、Facebook、TwitterのAPIキーは 管理ページ>コンフィグ>プロパティ設定 から設定できます。プロパティ設定画面の「ウェブサービス」からGoogle (ログイン)、Twitter(SNSログイン用)、Facebook アプリケーションの各情報を登録します。

Twitterの APIキー登録は2つありますのでお気をつけください。Twitter(SNSログイン用)を利用。


プロパティ設定画面

プロパティ設定画面


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

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

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


機能設定画面

機能設定画面


3. ユーザーごとの設定

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

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


ユーザー管理でSNSと関連づけます

ユーザー管理でSNSと関連づけます


認証がされている場合は「認証」ボタンが「認証解除」に変わって表示されます。各サービスの認証ボタンを押した時、サービスにログインしていない場合は、各サービスの認証画面が表示されます。ここでログインすることで、このユーザーでのa-blog cmsのSNSログインが有効になります。

ログインするには

ここまでの設定が行われていれば、ユーザーID、パスワードを入力しなくても、SNSログインボタンからログインできるようになります。SNSログイン機能を有効にした状態で、a-blog cmsのログイン画面を表示すると、通常のユーザーID、パスワードの入力欄の下に、Twitteのログインボタンが表示されます。


SNSログインが有効なログイン画面

SNSログインが有効なログイン画面