前回の記事 Azure Functions と Azure Active Directory B2C を連携させる　その１
に続いて、Azure Active Directory B2C の Local 認証(email による、ADユーザによる認証）に加えて、ソーシャルによくある Facebook から情報を持ってきて、ログインしたり、新しいユーザを作ったりする機能のセットアップを試してみる。下の図はその設定が終わった図だ。

Screen Shot 2017-10-29 at 12.32.57 AM.png

Facebook Application を作成する

最初に、Facebook Application の登録を行う。方法はここに書いてある。

Azure Active Directory B2C: Provide sign-up and sign-in to consumers with Facebook accounts

全くこのままなので、特に問題ないが、一応自分のを晒しておくとこんな感じ。前回と同じところに設定してみた。

特にポイントとなるのは、ここで、App ID と App Secret を控えておくこと。

Screen Shot 2017-10-29 at 2.17.49 AM.png

Screen Shot 2017-10-29 at 2.28.06 AM.png

Screen Shot 2017-10-29 at 2.18.11 AM.png

Screen Shot 2017-10-29 at 2.18.21 AM.png

B2C 側の設定の追加

identity provider

新たに Facebook を登録する。

先ほどの、Facebook Application の App ID と App Secret をここに登録する。

Screen Shot 2017-10-29 at 2.18.42 AM.png

Sign-up or sign-in policies

ここは、新しいのを作るのでなく既存のを選択して編集する。identity provider として　Facebookを登録すると、新たに、Facebook が選択可能になるので選択してセーブするだけ。

Screen Shot 2017-10-29 at 2.33.41 AM.png

NOTE: ちなみにここで、reply url が ..../.auth/login/aad/callback になっているが、これはこれで良い。ちなみに facebook 専用の reply url は ..../.auth/login/facebook/callback だが、今回は専用ではないので、この reply url ではない。

How to configure your App Service application to use Facebook login

Screen Shot 2017-10-29 at 2.19.16 AM.png

Azure Functions の設定

設定は変更する必要はない。紛らわしいのがプロバイダとして、Facebook という項目があることで、Action to take when request is not authenticated のところでも、Log in with Facebook というのが選べるが、ここは、Active Directory のままで良い。私は間違えて、Facebook もコンフィグしているが使われていない。
　Facebook というのは、Facebook の単独認証のことで、今回は、新しいユーザを作っても、Facebook から情報をもらって、AD にユーザ登録をする。だからAD の認証なのだ。上にややこしい注意書きが出ているが無視して良い。そもそもここに書いてあることは Functions では設定できない。

Screen Shot 2017-10-29 at 2.38.23 AM.png

悲惨なる結果

実はこの設定は完璧なのだが、私がトライすると、悲惨なことになった。Facebookの認証のページも出てくるのだが、最終的につぎのようになメッセージが帰ってきた。B2C, Facebookのアクティビティログにも特に何も出ていない。インターネットをみても、それらしい情報もない。

You do not have permission to view this directory or page.

正直、１日ぐらい悩んで、今わかった。なぜわかったかというと、Azure Functions には、Kudo という仕組みがあり、中身がみれる。

Screen Shot 2017-10-29 at 2.44.42 AM.png

散々色々設定を試してダメだった挙句、ふと思いついてここをみると

2017-10-28T15:58:05  PID[14244] Error       An error of type 'server_error' occurred during the login process: 'AADB2C90243: The IDP's client key/secret is not properly configured.
Correlation ID: 3a08ed5b-ed71-4763-94a0-2b9e0771474a
Timestamp: 2017-10-28 15:58:05Z
'
2017-10-28T15:58:48  PID[14244] Error       An error of type 'server_error' occurred during the login process: 'AADB2C90243%3a+The+IDP%27s+client+key%2fsecret+is+not+properly+configured.%0d%0aCorrelation+ID%3a+4fadd580-fa82-49be-8c79-16265b84e22d%0d%0aTimestamp%3a+2017-10-28+15%3a58%3a48Z%0d%0a'

な、なんだと、IDP's client key/secret が間違っているだと、、、俺は確かに、Facebook Application のページからコピー＆ペーストしたはず、、、もう一度、、、

原因がわかった。なんと、私は、OneNote にコピペしたのだが、その時に先頭が大文字になっていた orz。こんな単純なことが原因だったとは、、、orz

Screen Shot 2017-10-29 at 12.32.57 AM.png

そして、ついに、エラーが出ずここに来た！

Screen Shot 2017-10-29 at 2.49.20 AM.png

まとめ

B2C は結局むっちゃくちゃ簡単に設定できたのだった。ただ一点間抜けにもパスワードの先頭が大文字になっていたことをのぞいて、、、いけてるエンジニアになるときは、ロジカルに考えよう。まずログを見よう。話はそれからだ。

よし、これで、Facebook まで組み込めた。明日は、多要素認証を決めて終わりだ！

How to configure your App Service application to use Azure Active Directory login