Azure もくもく会 @ 東京 #18 での LT 資料 Azure Web app で Azure AD MFA をさくっと使ってみた話

1. App Service with Azure AD
~ Azure Web App で MFA 使ってみたの巻 ~
Azure もくもく会 @ 東京 #18 LT
6th Jan, 2018

2. 自己紹介
いのうえ (SharePoint 紳士)
@SpRestaurant (https://twitter.com/SpRestaurant)
SharePoint レストラン (http://sprestaurant.hatenablog.com/)
Azure もくもく会@東京 (https://azure-moku2.connpass.com/)
Azure もくもくハンズオン (https://github.com/Azure-Moku2-Study/Azure-moku2-textbook)
某 SIer で Office 365 や Azure であれこれしている人です。
最近「MCSE: Cloud Platform and Infrastructure」取れました。

3. こんなストーリーでやってみる
• 会社内で利用する Web アプリを Azure 上に構築する
• ある程度はセキュアにしたい

4. こんなストーリーでやってみる
• 会社内で利用する Web アプリを Azure 上に構築する
• ある程度はセキュアにしたい
Azure Web apps に Azure AD を統合する
※初歩的ミスをしがちなポイントあり

5. こんなストーリーでやってみる
• 会社内で利用する Web アプリを Azure 上に構築する
• ある程度はセキュアにしたい
せっかく Azure AD 統合するし、多要素認証を強制する。
お手軽に！！！

6. まずは、Azure AD のディレクトリを作成
既存の Azure AD を使う人は、MFA の設定部分だけやりましょう。

7. Azure AD を作成する

8. とりあえず 1 ユーザー作っておく

9. ユーザーに Azure AD MFA を強制する
「せんせー、MFA ってなんですか？」
「携帯電話や証明書なんかを組み合わせた今どきの認証方式だよ(｀・ω・´)」
※Azure MFA お金かかります。
でもセキュリティって保険だから…多少は、ね？

10. ユーザーに Azure AD MFA を強制する

11. ユーザーに Azure AD MFA を強制する

12. ユーザーに Azure AD MFA を強制する

13. ユーザー側の準備完了(｀・ω・´)

14. 次に、Web アプリを作成する
今回は普通の ASP.NET Web Application を作成するだけ。

15. Visual Studio でプロジェクトを作成
普通の .NET 4.6.2 の Web アプリケーション

16. Visual Studio でプロジェクトを作成
Azure AD に接続するので、ここで認証を構成

17. Visual Studio でプロジェクトを作成
Azure AD のディレクトリを入力する

18. とりあえずデバッグしてみる
Azure AD のユーザープロファイル情報を
読み取るためのアクセス許可が求められる

19. とりあえずデバッグしてみる
Azure AD のプロファイル読み取りを承諾したので、
名前が表示される

20. Azure にデプロイする
せっかくなので、CD (Continuos Delivery) を構成しちゃう。

21. Azure にデプロイする

22. Azure にデプロイする
お好みで Resource group name や
App Service Plan の設定を変更する

23. Azure にデプロイする
(わかりにくい場所で) 構成中のお知らせ

24. Azure にデプロイする
構成が完了すると、ちゃんと Azure リソースが
作成されている

25. Azure にデプロイする
もちろん、まだサイトはデプロイされていない
→ VSTS にコミットしていないので。

26. VSTS にソースをコミットすると…
Build が自動的に動いてる！

27. VSTS にソースをコミットすると…
Release definition が自動的に動いてる！

28. Web apps のサイトにアクセスする
localhost に飛ばされる！！！

29. なんでや！！！

30. 原因
• VS で Azure リソースを自動構成したため、Azure AD Application の設定も
当然ながら自動で行われた。
• プロジェクトの既定値の Web サイトは「https://localhost:xxxx」なので、
それが反映されている。
対応
• Azure AD Application の「応答 URL」を変更する

31. Azure AD Application の設定
Azure AD ディレクトリのアプリとして登録されている

32. Azure AD Application の設定

33. Azure AD Application の設定
これを追加する！

34. Azure AD Application の設定
これを削除する！

35. Azure AD Application の設定
ようやく繋がった！！！

36. 一般ユーザーでアクセスしてみる
最初に作成しておいた、一般ユーザーでサイトにアクセスしてみる。

37. 一般ユーザーでアクセスしてみる
MFA を強制したので、最初に
設定するように誘導される

38. 一般ユーザーでアクセスしてみる
MFA の構成が完了後、初回アクセスなので
アクセス許可要求を求められる

39. 一般ユーザーでアクセスしてみる
アクセス成功 (｀・ω・´)

40. 一般ユーザーでアクセスしてみる
次回からは、こんな画面が表示される