最終回 FacebookやGoogleのIDによるソーシャル・ログインを実現するクラウド・サービスと社内システムとのID連携 最新トレンド(1/2 ページ)

FacebookやGoogleなどのIDを利用した「ソーシャル・ログイン」には、ユーザー登録の手間を減らせるメリットがある。そこで、Windows Azure Active Directoryの「アクセス制御サービス(ACS)」を活用して、ECサイトでソーシャル・ログインを実現する方法を具体的に解説する。

» 2013年06月20日 16時42分 公開
[富士榮尚寛(Microsoft MVP - Forefront Identity Manager),伊藤忠テクノソリューションズ株式会社]
クラウド・サービスと社内システムとのID連携 最新トレンド
Windows Server Insider


「クラウド・サービスと社内システムとのID連携 最新トレンド」のインデックス

連載目次

 これまでの連載では、組織内のユーザーが社内のアイデンティティ管理基盤を利用してクラウド・サービスを利用するためのアイデンティティ連携の基礎と実践を解説してきた。最終回となる今回は、まったく別の視点から社外の利用者(顧客)のアイデンティティ連携について解説する。具体的にはWindows Azure Active Directoryアクセス制御サービスを利用して、FacebookやGoogleなどのソーシャルIDを使ったECサイトへのログイン(ソーシャル・ログイン)を行うための方法について解説する。

本稿で構築するアイデンティティ連携基盤の全体像 本稿で構築するアイデンティティ連携基盤の全体像

なぜソーシャルIDで社外向けサイトへログインさせるのか?

 今回解説するアイデンティティはこれまで解説した企業内とは違った位置付けなので、まず背景となっている社外向けサイト(特にECサイト)におけるアイデンティティに関する課題について紹介する。

 ソーシャル・アイデンティティ連携サービスを展開しているjanrain社は、公式ブログ上でSamsung社の製品サイトの事例を基に社外サイトにおける課題とアイデンティティ連携によるソーシャル・ログインの効果を紹介している。

 このブログによると、86%の消費者が会員登録を求めるとサイトから離脱してしまう、という数値が示された上で、会員登録の手間を省くためにソーシャル・ログインを導入したところ、以下の効果があったとしている。

  • 全登録者の34%以上が案内メールを開封
  • 63%以上がメール内のリンクをクリック
  • 製品レビュー数が506%増加

 これはソーシャル・ログインに対応することで、ECサイトなどにおけるコンバージョン率の向上やサイト内でのアクティビティの活性化を期待できること、さらにはサイトで販売している製品の売上向上などにつながる可能性があることを示している。

 また同様にソーシャルIDを使ってサイトを利用する際、自分が購入しようとしている商品をソーシャル・ネットワーク上の友人に見てもらい意見をもらえる(SNSのタイムラインへのシェア)ことも可能になっている例が多い。これは顧客自身の購買を促すとともに顧客の周囲への認知を得ることができるため、ビジネス上のメリットは大きい。

Windows Azure Active Directoryアクセス制御サービスとは?

 第1回でも解説したように、Windows Azure Active Directory(以下、WAAD)は「Access Control」、「Directory」、「Graph」、「Authentication Library」という4つの要素で構成されている。今回利用する「アクセス制御サービス」とはこの中の「Access Control」を指し、「Access Control Service」の頭文字をとって「ACS」の略称で呼ばれている。ちなみに以前のAppFabric Access Control時代から機能は進化しており、現在のACSのバージョンは2.0なので、「ACSv2」という略称で呼ばれることも多い。

 ACSが持つ機能は多岐にわたるが、今回利用する機能を簡単に説明すると「アイデンティティ・プロバイダとアプリケーション・サービスとの間のアイデンティティ連携を束ねるハブのようなもの」である。下図がACSの機能の概要を表したものだが、さまざまな外部アイデンティティ・プロバイダがサポートするさまざまなアイデンティティ連携プロトコルの違いを吸収し、WS-Federationに対応したアプリケーション・サービスへ橋渡しをしていることが分かる。

アクセス制御サービス(ACS)の機能概要 アクセス制御サービス(ACS)の機能概要
アクセス制御サービスはアイデンティティ・プロバイダとアプリケーション・サービスの間のアイデンティティ連携の橋渡しを行う。対応するプロトコルは今後も拡張されていくとみられる。

 ACSのようなサービスを利用する一番のメリットは、アプリケーション・サービス側で個別に外部アイデンティティ・プロバイダとの連携の設定を行う必要がない点である。例えば今後新しい外部アイデンティティ・プロバイダが登場したとしても、基本的にアプリケーション・サービス側では追加の設定やサービス停止の必要はない。ACS側のアイデンティティ・プロバイダ接続設定さえすれば、即時アプリケーション・サービスへのログインに新しいアイデンティティ・プロバイダを利用できるようになる。

Windows Azure Webサイト上に構築したECサイトへソーシャルIDでログインする

 今回はWindows Azureで現在プレビュー公開されているWebサイトの機能を使い、クラウド上に簡単にECサイトを立ち上げ、ACS経由でFacebookおよびGoogleのIDでログインできるようにする。

 そのためには、大きく分けて以下の作業が必要だ。

 では、順番に設定を行っていく。

●ACSにIDプロバイダを登録する

関連リンク 基礎から分かる、Facebookアプリの作り方(Smart & Socialフォーラム)

 今回は、FacebookおよびGoogleのID情報を使ってログインをするため、ACSのIDプロバイダ設定にそれら2つのサービスを登録する。GoogleについてはACS側にあらかじめ設定がされているため特に準備作業は不要だが、FacebookについてはACSがFacebookアプリケーションとして動作してID情報を取得するため、Facebook側にアプリケーションとして登録をしておく必要がある。Facebookアプリケーションの作成・登録方法の詳細は右上の関連リンクの記事を参照していただきたい。

FacebookとACS、アプリケーションの連携時の手順 FacebookとACS、アプリケーションの連携時の手順
アプリケーションとACSはWS-Federationを使ったID連携を行う。連携するID情報はユーザーの代わりにACSがFacebookから取得する。その際のFacebook APIへのアクセス認可をOAuthで行うので、あらかじめACSをFacebookアプリケーションとして登録しておく必要がある。

 FacebookをACSのIDプロバイダとして登録するために必要なアプリケーションIDとアプリケーション・シークレット(OAuthのclient_idおよびclient_secret)を取得するため、Facebookアプリケーションの作成を行う。

 まずはFacebookにログインし、画面右上のユーザー・プロファイルの横に表示される歯車のアイコンをクリックし、[アプリを作成]メニューを起動する。これが表示されない場合は先にFacebook開発者の登録を行う。具体的にはFacebook Developersのアプリ・ページを開いて、右上の[Register as a Developer]ボタンをクリックして開発者登録を済ませる。

Facebookでアプリケーション作成画面を開く Facebookでアプリケーション作成画面を開く
これはログイン後のFacebook画面の右上隅部分。
  (1)これをクリックしてメニュー一覧を開く。
  (2)これをクリックする。

 Facebook Developersページへと画面が遷移するので、画面上部のメニューの[Apps]を開き、[新しいアプリを作成]ボタンをクリックする。

Facebookのアプリケーション作成画面 Facebookのアプリケーション作成画面
アプリケーションIDとアプリケーション・シークレットを取得するために、ここでFacebookアプリケーションを作成する。
  (1)これをクリックしてアプリ・ページを開く。
  (2)これをクリックするとFacebook Developersページが表示される。

 次に表示されるダイアログで、App NameおよびApp Namespaceに任意の値を入れるとアプリケーションが作成される。その次の画面では[連絡先メールアドレス]と[Facebookでログインするウェブサイト]の設定を行う。今回はACSが[Facebookでログインするウェブサイト]に該当するため、ACSのURLを登録する。

Facebookアプリケーションの基本的な設定を行う Facebookアプリケーションの基本的な設定を行う
先ほどの[新しいアプリを作成]ボタンをクリックして表示されるダイアログでApp NameとApp Namespaceを入力すると、この画面が表示される。
  (1)[App ID]と[App Secret]は、あとでACSの設定時に指定するのでメモしておく。
  (2)連絡先としてのメール・アドレスを入力する。
  (3)ここではACSのURLを入力する。

 ここまでくれば後はACS側にここで取得したアプリケーションID(App ID)とアプリケーション・シークレット(App Secret)を登録するだけだ。Facebookアプリケーションの設定画面の上部にApp IDとApp Secretの値が表示されているので、ACSへその値を登録する。以下、その手順を説明する。

 なお、ACS名前空間の作成および管理はWindows Azureの管理ポータルから行う。

 左のナビゲーションよりActive Directoryを選択し、左下の[新規]ボタンをクリックすると新しいACS名前空間を作成できる。

Windows Azure Active DirectoryのACS名前空間を新たに作成する Windows Azure Active DirectoryのACS名前空間を新たに作成する
Windows Azure管理ポータルのトップ画面で左側ナビゲーションから[Active Directory]を選び、左下に表示される[新規]をクリックすると、このメニューが表示される。
  (1)これをクリックしてACS名前空間を作成する。

 作成が完了したACS名前空間を選択し、画面下部の[管理]をクリックしてACSの管理ポータル画面を開く(執筆時点でWindows Azureの管理ポータルとは統合されておらず、別の画面へ遷移する)。左側のナビゲーション・メニューに見えるIDプロバイダがACSから見たID連携元となり、FacebookやGoogleはここに登録する。

ACSの管理画面 ACSの管理画面
Windows Azure Active Directory設定画面で、作成したACS名前空間を選択してから画面下部の[管理]をクリックすると、この画面が表示される。ここでIDプロバイダなどの登録ができる。
  (1)これがACSから見たID連携元になる。FacebookやGoogleはここに登録する。

 では、さっそくFacebookとGoogleを登録する。左側ナビゲーション・メニューの[IDプロバイダー]をクリックすると、あらかじめ登録されているIDプロバイダとしてWindows Live ID(Microsoftアカウント)が表示されるので、[追加]をクリックする。ここで[Facebookアプリケーション]を選択して[次へ]をクリックする。

IDプロバイダを追加する IDプロバイダを追加する
これはACS管理画面で左側のナビゲーション・メニューから[IDプロバイダー]−[追加]とクリックして表示される画面。ここからFacebookアプリケーションをIDプロバイダとして追加する。
  (1)Facebookの場合はこれを選ぶ。この後、対象のFacebookアプリケーションに関する設定が必要になる。
  (2)Googleの場合、最初から構成済みなのでこれを選ぶだけでよい。

 すると、Facebookアプリケーションに関する情報を設定する画面へ遷移するため、先ほどFacebook上で取得したApp IDおよびApp Secretを設定し、保存する。

追加するFacebookアプリケーションを指定する 追加するFacebookアプリケーションを指定する
ここで対象のFacebookアプリケーションに関する情報を設定する。
  (1)事前にFacebookで作成したアプリケーションのApp IDを入力する。
  (2)同じくFacebookで作成したアプリケーションのApp Secretを入力する。
  (3)Facebookへ要求する権限(Permission)のリストを記入する。ここではメール・アドレス属性を取得するために「email」と入力する(Facebookの権限については、Facebook開発者の「Login Permissions Reference」を参照のこと)。

 これでFacebookをACSのIDプロバイダとして登録できた。同じくGoogleについても登録を行うが、こちらはあらかじめ特に設定をする必要はなく単純に追加するだけでよい。設定が完了するとIDプロバイダのリストには以下のように登録したサービスが表示されるはずだ。

ACSに登録したIDプロバイダ ACSに登録したIDプロバイダ
これはACS管理画面におけるIDプロバイダ一覧。
  (1)ここまでの手順で登録したFacebookとGoogleの各サービス。

 これでACSへのIDプロバイダ登録の作業は終わりなので、次はユーザーが利用するアプリケーションに関する情報をACSに証明書利用者アプリケーションとして登録する。


       1|2 次のページへ

Copyright© Digital Advantage Corp. All Rights Reserved.

スポンサーからのお知らせPR

注目のテーマ

Microsoft & Windows最前線2025
AI for エンジニアリング
ローコード/ノーコード セントラル by @IT - ITエンジニアがビジネスの中心で活躍する組織へ
Cloud Native Central by @IT - スケーラブルな能力を組織に
システム開発ノウハウ 【発注ナビ】PR
あなたにおすすめの記事PR

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。