Check! Azure Web Apps に認証をかけて、特定のユーザーしか利用できないようにする

こんばんは、オークファンの @dz_ こと大平かづみです。

Prologue - はじめに
====
[Azure Web Apps](https://azure.microsoft.com/ja-jp/services/app-service/web/ "Web App Service | Microsoft Azure") は、.NET、Java、PHP、Node.js、Python をサポートし、ブルーグリーンデプロイの仕組みなどを備えた商用利用が可能な PaaS です。

実は、 Web Apps には無料や低価格のプランもあり、プロトタイプを作りたいときにも重宝します。

そんなとき、パブリックに公開するのではなく、特定のメンバーだけが見えるように認証をかけたいと思いませんか？

Azureの機能だけで、簡単にできちゃうんです。さっそくやってみましょう！

概要
=====
どういう仕組みかといいますと、 Web Apps は「認証/承認」を設定することができ、以下の「認証プロバイダー」を選択できます。今回は「[Azure Active Directory](https://azure.microsoft.com/ja-jp/services/active-directory/)」を利用します。

- Azure Active Directory (Azure AD) ← 注目
- Facebook
- Google
- Twitter
- Microsoft アカウント

Azure Active Directory は、連携するアプリケーションを登録することができ、さらに利用するユーザーを個別に割り当てることができるので、利用ユーザーを限定できるようになります。

大まかな流れ
===========
Azure のアカウントがあることを前提に進めます。まだアカウントがない方は、「[無料の Azure アカウントを今すぐ作成](https://azure.microsoft.com/ja-jp/free/ "無料の Azure アカウントを今すぐ作成 | Microsoft Azure")」から無料で利用を開始することができます。

1. Web App を作成する
2. Web App で「認証/承認」を設定する
    1. 「高速」で設定する
    2. 「詳細設定」で設定する
3. 認証の動作確認をする
4. Azure AD でユーザーを割り当てる
    5. Azure AD の「構成」>「割り当てが必要」を有効に
    6. 対象のユーザーを割り当てる

手順
====
Web App を作成する
-------------------
まず Web App を作成します。または、テンプレートから Web App を作成したい方は、「[Azure App Service を使ってみる](https://tryappservice.azure.com/)」をご利用くださいませ。


まず、[ポータル](https://portal.azure.com/ "ダッシュボード - Microsoft Azure") で、「新規」>「Web + モバイル」>「Web App」を開きます。必要事項を記入して、作成してください。
![20160719_webapps_002.png](https://qiita-image-store.s3.amazonaws.com/0/3812/080c0a75-06ae-6f24-b261-ea4662603b3c.png)

Web App が作成されたら、URL を開いてみましょう。特に制限はかからず、ウェブページが表示されることを確認します。

![20160723_webapps_005.png](https://qiita-image-store.s3.amazonaws.com/0/3812/e6f7c559-0e64-e969-06f1-84cd4f24184b.png)

Web App で「認証/承認」を設定する
--------------------------------
それでは、「設定」>「認証/承認」に進みましょう。

App Service 認証を「オン」に変更すると、認証プロバイダーの一覧が表示されます。「Azure Active Directory」を選択します。

![20160723_webapps_008.png](https://qiita-image-store.s3.amazonaws.com/0/3812/1dd0233c-2465-0468-fcb3-ebb96399e6ce.png)

Azure Active Directory との連携には、「高速」と「詳細設定」の2通りの設定方法があります。

### 「高速」で設定する
より簡単に設定したい場合は「高速」を選びます。

「高速」では、もともと用意されている Azure Active Directory の「既定のディレクトリ」にアプリケーションを追加することになります。新規にアプリケーション登録をするか、既存のアプリケーションとして登録します。

![20160723_webapps_011.png](https://qiita-image-store.s3.amazonaws.com/0/3812/7828b12e-6eca-0d85-bf16-38fb61739e73.png)

### 「詳細設定」で設定する
「詳細設定」では、「既定のディレクトリ」以外のディレクトリのアプリケーションを指定することができます。

少し複雑なので、別途記事に書こうと思います。

認証の動作確認をする
----------------------
「認証/承認」が設定できたら、確認してみましょう。

「高速」で設定した場合、少なくとも1ユーザー、すなわち Azure を操作しているアカウントそのものでログインできるようになっています。

動作確認をする際は、シークレットブラウズ（シークレットウィンドウ）を使うと便利です。シークレットブラウズで、 Web App の URL を開いてみましょう。

すると、下図のように認証を求められるようになります。設定したディレクトリにあるユーザーでログインできることが確認できましたね！

![20160723_webapps_015.png](https://qiita-image-store.s3.amazonaws.com/0/3812/ebd15c32-ff87-0d87-a393-5c674a9580e4.png)


Azure AD でユーザーを割り当てる
-------------------------------
Azure AD のディレクトリにアプリケーションを登録すると、自動的にディレクトリに登録されているユーザーが適用されます。

もし、ディレクトリ全体ではなく特定のユーザーだけを許可したい場合は、ユーザーの割り当てを行います。

### 「アプリケーション」のユーザーの割り当て

Azure AD の操作は旧ポータル ( https://manage.windowsazure.com ) から行います。Active Directory で対象のディレクトリを開きます。

![20160814_webapps_019.png](https://qiita-image-store.s3.amazonaws.com/0/3812/f37920a1-6a78-343f-d5e2-14ffad54849e.png)

「アプリケーション」を開き、対象のアプリケーションの「構成」画面を開きます。

![20160814_webapps_020.png](https://qiita-image-store.s3.amazonaws.com/0/3812/643482c6-93e7-1d4e-2fa2-b9c960832e65.png)

「アプリケーションにアクセスするユーザー割り当てが必要」を「はい」に変更し保存します。次にアプリケーションの「ユーザー」画面を開きます。

![20160814_webapps_023.png](https://qiita-image-store.s3.amazonaws.com/0/3812/a826900d-298f-5af0-b139-6b42ae1ec121.png)

割り当てたいユーザーを選択し、画面下部の「割り当て」をクリックし、「はい」をクリックします。これで、ユーザーの割り当てが完了です。

![20160904_webapps_027.png](https://qiita-image-store.s3.amazonaws.com/0/3812/467b37e8-352b-0e62-fdb4-1623ce6c2573.png)

### 割り当てたユーザーでログイン確認

割り当てが完了したら、シークレットブラウズで動作確認してみましょう！割り当てたユーザーでログインできれば完了です。

Epilogue - おわりに
===================

この手順を覚えておくと、アプリをさくっと作って、さくっと組織にだけ公開することができるようになります。ぜひお試しくださいませ～ヾ(o´∀｀o)ﾉ