【Auth0】公式サンプルアプリケーション(Node.js)でサインアップとログインを試す
はじめに
Auth0のNode.jsサンプルアプリケーションを動かしてサインアップとログインをします。
サンプルアプリケーションは以下で公開されています。
https://github.com/auth0-samples/auth0-nodejs-webapp-sample
アプリケーションの準備
アプリケーションの登録
Auth0の管理画面にアクセスしApplications
の画面を開きます。
Applications
の画面の右上に表示されているCREATE APPLICATION
を押してアプリケーションを作成します。
表示されたアプリケーション作成画面に任意のアプリケーション名を入力しRegular Web Applications
を選択します。
CREATE
ボタンを押すと管理画面に作成したアプリケーションが表示されます。
公式サンプルのダウンロード
アプリケーションを登録すると表示されるQuick Start
画面の中からNode.jsのアイコンを選択します。
Node.js用のチュートリアルのページが表示されます。
本記事ではNode.jsのサンプルアプリケーションを利用するのでチュートリアル先頭右側に表示されているDOWNLOAD SAMPLE
からソースコードをダウンロードします。
DOWNLOAD SAMPLE
を押すとサンプルアプリケーションを動かすまでの手順が表示されます。以降この内容の通り管理画面で設定を行います。
一番下のDOWNLOAD
を押してソースコード(zipファイル)をダウンロードし、任意の場所に解凍します。
アプリケーションの環境変数設定
本記事の流れの通りにサンプルアプリケーションのソースコードをダウンロードした場合はアプリケーションの環境変数として読み込まれる.env
ファイルにすでに適切な値が設定されています。
別ページからソースコードをダウンロードした場合は.env
ファイルに自分で値を設定する必要があります。
設定する値は登録したアプリケーションのSettings
タブに表示されるBasic Infomation
のDomain
・Client ID
・Client Secret
になります。
AUTH0_CLIENT_ID=ABCDEFGHI...
AUTH0_DOMAIN=abc.auth0.com
AUTH0_CLIENT_SECRET=ABCDEFGHI...
管理画面でのアプリケーション設定
Settings
タブを開きApplication URIs
の設定を行います。
http://localhost:3000/callback
http://localhost:3000
これでアプリケーションの準備は完了です。
動作確認
アプリケーションの起動
ダウンロードしたサンプルアプリケーションの解凍先に移動してコマンドを入力します。
ローカルにインストールしているNode.jsで動かす場合はnpmコマンドを利用して起動します。
npm install
npm start
dockerを利用する場合はOSに合わせて以下のコマンドを入力します。
sh exec.sh
./exe.ps1
ブラウザからhttp://localhost:3000
にアクセスするとサンプルアプリケーションの画面が表示されます。
サインアップ
サンプルアプリケーションの画面のLog In
を押すとAuth0のログイン画面が表示されます。
初回はユーザーが登録されていないのでSign Up
を選択してサインアップを行います。
登録するメールアドレスとパスワードを入力してSIGN UP
を押すとサインアップが完了します。
サインアップが完了するとサンプルアプリケーションに戻りProfile
のページが表示されます。
次は今サインアップしたユーザーでログインをしてみるので上部メニューのLog Out
を押してログアウトをします。
ログアウトをするとサインアップする前と同じ画面が表示されます。
ログイン
先ほど作成したユーザーでログインします。
サインアップしたときと同じようにLog In
を押してAuth0のログイン画面を表示させます。
メールアドレスとパスワードを入力してLOG IN
を押します。
ログインが成功するとサインアップのときと同じようにProfile
のページが表示されます。
動作確認は以上で終わりです。
おわりに
公式のサンプルアプリケーションを利用すると簡単かつ短時間でAuth0のサインアップとログインを体験することができます。
Auth0をまだ利用したことがないかたはぜひ試してみてください。
Author And Source
この問題について(【Auth0】公式サンプルアプリケーション(Node.js)でサインアップとログインを試す), 我々は、より多くの情報をここで見つけました https://qiita.com/smesh/items/13f7aef0731c1b16c928著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .