クラウド認証サービス Auth0 の無料トライアルを試してみよう

# Auth0 クラウド統合認証プラットフォーム とは
Auth0はWebアプリやモバイル、APIなどに対して認証・認可のサービスをクラウドで提供している、いわゆるIDaaS (Identity as a Service)ベンダーです。企業がもつWebアプリケーションやAPI, Native Mobile Appなどでユーザー認証や認可、セキュリティを組み込みたいけれでも実装が難しい・・・という方にオススメのソリューションを提供しています。


<p><a href="https://auth0.com/docs/overview?wvideo=s15ysw45uy"><img src="https://embedwistia-a.akamaihd.net/deliveries/25fa8c921cfed649925ebd725c41dc7b0ec64d4f.jpg?image_play_button_size=2x&amp;image_crop_resized=960x540&amp;image_play_button=1&amp;image_play_button_color=7b796ae0" width="400" height="225" style="width: 400px; height: 225px;"></a></p><p><a href="https://auth0.com/docs/overview?wvideo=s15ysw45uy">Auth0 Developer Overview</a></p>

Auth0が提供する機能については[認証プラットフォーム Auth0とは？](https://qiita.com/furuth/items/68c3caa3127cbf4f6b77) もしくは 上記のビデオでご説明していますのでこちらも参照いただけますでしょうか。

Auth0では、実際にどれだけ簡単に上記のような認証/認可機能を実現できるかをお気軽に確認できるように、無料トライアルを提供しています。登録も非常に簡単なのでぜひ試してみましょう！

以下に、無料トライアルの手順をご紹介いたします。

##1. Auth0のホームページにアクセスする
Auth0ホームページ(https://auth0.com/jp) にアクセスします。
<img width="993" alt="スクリーンショット 2017-09-24 1.22.23.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/f4130f8b-1812-a6bc-301f-aa4cdc0c1ef9.png">

無料トライアルもしくは画面右上のSIGN UPをクリックします。

<img width="296" alt="スクリーンショット 2017-09-24 1.23.04.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/8b38ac21-7457-2909-e79b-061709b5fd5c.png">

Auth0のSIGN UP画面が表示されるので、メールアドレス / パスワードでサインアップをするか、もしくは既にお持ちのGithub, Google, LinkedIn, もしくはMicrosoftアカウントを使用してサインアップをすることができます。(**登録したユーザーがAuth0テナントの最初の管理者となります。**)

<img width="570" alt="スクリーンショット 2017-09-24 1.33.36.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/114b2f63-b5fa-d97b-6c5a-25c88a360acb.png">

登録したメールアドレスに「Verify Your Account」という確認メールが届いているので、メールに記載されたリンクをクリックするか、「VERIFY YOUR ACCOUNT」ボタンをクリックします。

先ほどと同じログイン画面が表示されます。登録されたアカウント情報を使用してログインをします。

##2. テナントの作成
サインアップが完了すると、Welcome to Auth0と書かれたページが表示されます。

<img width="571" alt="スクリーンショット 2017-09-24 1.30.17.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/6ff90063-e8ec-7be7-09f2-1e2401c547fc.png">

ここでAuth0のドメイン名とドメインを登録する地域を定義します。(**注意：テナントドメインは一度設定したら変更ができません。**)　テナント名の定義とテナントが作成される地域　(US:米国, EU:ヨーロッパ, AU:オーストラリア)　の選択が完了したら、Nextをクリックします。

するとTell us more画面が表示されます。

<img width="612" alt="スクリーンショット 2017-09-24 1.40.09.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/1961ebfd-f322-1455-bb91-91bf1f57a098.png">

画面の指示にしたがって、テナントのご利用についてのアンケートに答えてください。

**ACCOUNT TYPE**
登録したアカウントは会社用のアカウント(Company)、もしくは個人用(Personal)かを選択します
(Companyを選択した場合には以下の項目が表示されます)
会社名(COMPANY NAME)と社員数(EMPLOYEES: 1-10, 10-50, 51-200, 200-2500, もしくは2500以上)を選択します

**ROLE**
テナント登録者は技術者(Developer)か、そうでないか(Non developer)かを選択します

**PROJECT**
Auth0テナントの使用目的は以下のどれに当てはまるかを選択します。
・Application for Consumers (B2C)
・Application for partner companies (B2B)
・Application for my employees (B2E)
・Just playing ground

設問に回答いたしましたら、「**CREATE ACCOUNT**」をクリックします。するとAuth0のテナントが作成され、[Auth0 Dashboard](https://manage.auth0.com/#/)が表示されます。

<img width="1262" alt="スクリーンショット 2017-09-24 22.13.04.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/400bd186-27b1-a378-1d5c-ef61785ddc19.png">

**お疲れ様です！　これで、テナントの作成は完了いたました。**

###ライセンスについて
(無料トライアル期間は22日間(無料トライアル期間中、作成されたテナントはEnterpriseライセンスと同じ機能が使用できます。無料トライアル期間が満了すると、テナントは一部機能が制限されたFreeライセンスに移行しますが、そのまま使用し続けることは可能です)
Auth0のライセンス価格及びライセンス形態については、https://auth0.com/pricing をご参照ください。

テナントご利用のどのタイミングでも、ライセンスをDeveloper, Developer Proに移行することは可能です。Developer, Developer Proはクレジットカード決済となります。Enterpriseライセンスに移行したい場合には、[Auth0ホームページ](https://auth0.com/jp)上段の**「お問い合わせ」**からご連絡ください。

##3. Auth0の機能を試してみよう
初めてテナントを作成すると、画面下に**Welcome to Auth0**のポップアップが表示されます。このポップアップにある、**START THIS TUTORIAL**をクリックすることで、Auth0の設定を簡単に理解できるためのチュートリアルを始めることができます。
(既にAuth0にご利用中の方でも、Dashboardから**Documentation** > **Getting Started** をクリックすることで、いつでもチュートリアルを始めることができます)

###3-0. チュートリアルを始める
START THIS TUTORIALをクリックします。(以下BtoC用ののチュートリアルとなります)

<img width="384" alt="スクリーンショット 2017-09-24 22.19.43.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/690e8a28-93d0-9249-c1ba-6866b9754910.png">

チュートリアルでは、以下の作業を実際に設定しながら機能を理解することができます。
・Create users (ユーザーの作成)
・Add metadata to your users (ユーザーのプロフィール情報をMetadataに追加する)
・Enable social connection (ソーシャルログイン機能を利用する)
・Create your first rule (ルールを作成する)
・Integrate your application (アプリケーションにAuth0認証機能を統合する)

**「NEXT」**をクリックして、実際にチュートリアルを始めてみましょう。

###3-1. ユーザーの作成
(1). Dashboard左側のメニューから**Users**をクリックします

(2). **User**メニューから**Create User**をクリックし、画面右上の**+ CREATE USER**もしくは、**+ CREATE YOUR FIRST USER**をクリックします。

<img width="767" alt="スクリーンショット 2017-09-24 23.25.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/95204430-1042-8dd4-8811-204f8da3b863.png">

(3).　作成するユーザーのemailアドレスとパスワードを入力します。

<img width="1046" alt="スクリーンショット 2017-09-24 23.25.38.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/2f97c5e7-a0b2-6dcc-6646-cdadd702dee9.png">

正しいパスワードが入力されたことを確認するためにRepeat Passwordに同じパスワードを入力し、エラーが表示されなければ「**SAVE**」をクリックします。

(4). (3)で入力したユーザーのemailアドレスにアカウント確認のためのメールが届きます。

<img width="570" alt="スクリーンショット 2017-09-24 23.27.27.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/2a57b89e-c9fe-1d4f-bb1e-1225c8a0a75c.png">

メール中のリンクをクリックするか、「**VERIFY YOUR ACCOUNT**」をクリックしてください。
もしアカウント確認用のemailテンプレートを修正したい場合には、Dashboard左側のEmailsメニューからテンプレートを修正することができます。
emailアドレスの確認が完了すると以下の画面が表示されます。

<img width="414" alt="スクリーンショット 2017-09-24 23.27.54.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/2520a523-dfa3-9c55-9d71-c69f9a9b416d.png">

(5). チュートリアル画面に表示された　[**TEST NEW USER LOGIN**](https://manage.auth0.com/tester?connection=Username-Password-Authentication) をクリックます。

<img width="295" alt="スクリーンショット 2017-09-24 23.28.55.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/924c36a3-1984-6977-94bc-103c0bde4998.png">

作成したユーザーのemailアドレス及びパスワードでログインのテストをします。

正しく認証されると以下のような画面が表示されます。

<img width="880" alt="スクリーンショット 2017-09-24 23.29.37.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/1f7363fc-4ca4-f603-8df8-56cb7bfd073d.png">

(1)〜(5)まで終わりましたら、チュートリアル画面の「**NEXT**」をクリックします。

###3-2. ユーザーのプロフィール情報をMetadataに追加する
(1). Dashboard左側のメニューから**Users**をクリックします
(2). ユーザーの詳細情報を表示・編集するために作成したユーザーをクリックします
(3). Metadataセクションまで画面をスクロールダウンします。`user_metadata`と`app_metadata`があることが確認できます。
(4). 以下の内容をuser_metadataに入力します

```json
{
  "nickname": "furuchan"
}
```

(5). **SAVE**ボタンをクリックします
(6). **Users**メニューから `nickname = furuchan` もしくは `user_metadata.nickname
 = furuchan`で検索するか、APIからmetadataを使用して検索することができます。 (metadataの内容がIndex化されるまでに時間がかかる場合があり、すぐに検索ができない場合があります)

(1)〜(6)まで終わりましたら、「NEXT」をクリックします。

###3-3. Enable social connections
評価用にAuth0 development keyを自動発行しますが、本番用に使用する場合には各SocialプロバイダーからClient IDとClient Secretを発行してもらったものを使用してください。

(1). Dashboardの左側メニューから **Connections** > **Social**をクリックします
(2). **Google**, **Facebook**, 及び **Twitter**のスイッチをOnにします

![スクリーンショット 2017-09-28 0.42.58.png](https://qiita-image-store.s3.amazonaws.com/0/189613/c1594922-9308-70e8-71ee-4fb1e31200d5.png)

(3). 再度テスト認証を行ってみると、スイッチをOnにしたソーシャルアカウントがログイン画面に表示されていることが確認できます。**Auth0認証プラットフォームを利用することで、特に面倒臭いコーディングは一切必要とせず、簡単に様々なソーシャルアカウントを利用することができるようになります。**

![スクリーンショット 2017-09-28 0.47.04.png](https://qiita-image-store.s3.amazonaws.com/0/189613/7f05d81c-a8c1-1645-e2a3-c7ff19154bd1.png)

実際にソーシャルアカウントを使用してテスト認証をしてみてください。

(1)〜(3)まで終わりましたら、「NEXT」をクリックします。

###3-4. ルールを作成する
(1). Dashboard左側のメニューから **Rules** をクリックします
(2). **+ Create Your First Rule** ボタンをクリックします.
(3). `Access control`セクションから **Email domain whitelist**をクリックします。 以下のようなルール テンプレートが表示されるので、許可するemailドメインを定義します。

<img width="712" alt="スクリーンショット 2017-09-27 16.42.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/9e8e572b-8029-289f-aa80-17a177fc1013.png">

**例：`var whitelist = ['example.com', 'example.org'];`**

(4). **SAVE** ボタンをクリックします
(5). SAVE後に1つはWhitelistに登録したemailドメイン、もう１つはWhitelistに登録されていないemailドメインの２つの異なるemailドメインでログインを試してみてください。**TRY THIS RULE**をクリックし、ユーザーの`email`キーを変更することで確認することができます。

<img width="486" alt="スクリーンショット 2017-09-27 18.32.02.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/b0e23614-70be-a0b5-1e9b-996573361da2.png">

(1)〜(5)まで終わりましたら、「NEXT」をクリックします。

###3-5. アプリケーションにAuth0認証機能を統合する
(1). Dashboard左側のメニューから **Clients** をクリックします
(2). **+ New Client** ボタンをクリックします
(3). アプリケーション名を入力したのち、作成したいクライアントタイプを選択します
<img width="584" alt="Create_Client.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/6252fa24-b6fa-e5cd-3093-273627800438.png">

(4). **CREATE** ボタンをクリックします
(5). 使用したいフレームワークを選択し、Quick Startから各フレームワーク対応のサンプルプロジェクトのダウンロード、記載されている手順やスクリプトを参照してアプリにAuth0認証機能を統合します。
Quick Startの指示に従いサンプルプロジェクトの設定が終わったら、サンプルプロジェクトを実行してAuth0認証ができるかどうか試してみましょう。

(1)〜(5)まで終わったら、「NEXT」をクリックします。


**お疲れ様でした！これで、Tutorialは終了です。**

このTutorialを再試行してみたい場合には、Auth0 Dashboard画面右上にある、`Documentation` > `Getting Started`をクリックしてください。

Auth0のサービスは契約をしなくとも無料トライアル：2２日間をすることができます。無料トライアルは、[Auth0のホームページ](https://auth0.com/jp "http://auth0.com/jp")にアクセスし、画面右上の<A HREF="https://auth0.com/signup?utm_campaign=auth0_blog_free_trial_Qiita_jp&utm_source=qiita"><img width="123" alt="スクリーンショット 2017-09-07 21.59.09.png" src="https://qiita-image-store.s3.amazonaws.com/0/189613/c0ffbce4-d802-6fdd-ea2a-aa4a7ccd775b.png"></a>か、無料トライアルボタンをクリックするとトライアル登録が行うことができます。ユーザー登録にはGitgubやGoogle, Microsoftアカウントを使用してサインアップすることできますので、お気軽に試してみてはいかがでしょうか？