NetlifyでデプロイしたサイトのAuth0のソーシャルログインが動かない
今月からアサインされるプロジェクトでAuth0を使った認証を使う感じになりそうだったので事前に試してみたのですが、ちょっとつまずいたところがあったのでメモ。
以下の記事を参照にNuxtのSPAでAuth0を導入してみました。
▼ 動いてるやつ
NuxtではAuth Moduleを使えばAuth0によるソーシャルログインが超あっさりと実装できるんですね。よく見るログイン画面が現れ、指示通りにログイン処理を行うと、用意しておいたプロフィールページで自分の情報が表示されたのでちょっと感動しました。
Netlifyにデプロイすると動かない
Auth0のデフォルトではGoogleアカウントによる認証が用意されているのですが、その他にもFacebookやLINEのアカウントによる認証を試してみたいと思い、ひとまずローカルではなくWebにアップしようと思い、いつもとおりNetlifyでデプロイしてみました。
すると、動かない……。うーん、なんでだろ。
本来、このcallbackがちらっと表示されて、その後スムースにプロフィールが表示されるページへ遷移するはずなのですが、callbackの時点で止まってしまう。
開発者ツールを見てもJWTを付与したリクエストは問題なく行われてるっぽい。
結論:NetlifyではJWTの利用は有料
原因が特定できず1時間くらい唸っていたのですが、結論をいうとNetlifyではJWTを使った認証は有料プランしか使えないとのこと。
Netlifyの管理画面 > Settings > Access control で確認できます。
たぶんここでAuth0で入手できるClient Secretを入力すればいいんだと思います。
すごい悩んでたのに、そもそもNetlifyはJWTトークンを使った認証は有料というオチ。ちょっとくらい試させてくれ。おつかれさまでした。 pic.twitter.com/n2Bb3Na0c6
— shimotsu (@shimotsu_) 2019年12月1日
終了。おつかれさまでした。