Auth0を試してみる

会員制サイトの立ち上げ方法の勉強のためにAuth0をを試してみる。自前でユーザーの個人情報などを抱えてしまうと管理が大変なのと万が一事故が起こった時に、めんどくさいので、無料で使えるAuth0を使って、ユーザー管理の機能を実験。

手っ取り早く始めるためのサンプルアプリケーションも公開されていて、ローカルのマシンで試すことができるので非常に便利。

サンプルコードを実行する

スクリーンショット (7)

Auth0のアカウントを作ってログインして、左のApplicationメニューを選択し、Deafult Appを選びQuick Startのタブから簡単なサンプルをダウンロードする。
Reactなどの環境が整っているとほんとに2分ぐらいでAuth0を使ったログインアプリを立ち上げられる。

スクリーンショット (3)


ここで新規ユーザー登録などもでき、順調と思ったところで...


Unhandled Rejection(Error): Unauthorized

ダウンロードしたコードには自分用のClident IDなどが埋め込まれているためエラーになるはずがないのだが、何回やっても、Reactだけでなくvueを試したり、Reactベースで自分で書いたりしてもやはりエラーになる。


スクリーンショット (5)
スクリーンショット (6)


ググってるとFailed Exchange, Unauthorizedになるのは、Application Typeの問題であるような記事を見かけるが、Application TypeをきちんとSingle Page Applicationにしてもエラーになる。
Auth0のコミュニティーをあさりまくってようやく有効な投稿に出くわす
スクリーンショット (8)

いったん、Auto0のApplicationのSettingsでApplication TypeをRegular Web Applicationに変更して、Token Endpoint Authentication MethodをNoneにしてやるとエラーが回避される。その後、Single Page Applicationに戻すとエラーは消える。Auth0の問題だと思うが、Application TypeをSingle Page Applicationにしても、Token Endpoint AuthenticationがNoneに切り替わらない場合があるのでは?(今となっては再現しなくなってしまったのでわからないが)

2分で終わるはずが4~5時間悩んでしまった...