Nuxt.js Auth Refresh 作業
バックエンドのLaravelでは、リフレッシュトークンが問題なく正常に動作する。..\ それなら、今度はNuxt.js Auth側で処理してもらわなければならない... \$axios でヘッダーに認証情報がある場合、新しいトークンに置き換える処理を通して...\ とても自然な形でトークンの設定を変更し、途切れることな
バックエンドのLaravelでは、リフレッシュトークンが問題なく正常に動作する。..
それなら、今度はNuxt.js Auth側で処理してもらわなければならない...
$axios でヘッダーに認証情報がある場合、新しいトークンに置き換える処理を通して...
とても自然な形でトークンの設定を変更し、途切れることなく正常に動作することを確認した。
しかし、ここで発生した問題は... ページを再読み込みしたときの問題だ !!
再読み込みすると、Authはそのトークンで(おそらくクッキーの値じゃないだろうか?)
user を呼び出す... その呼び出しに成功すると、新しいユーザーデータをローカルストレージに保存して表示するようだ..
失敗した場合は、既存のローカルストレージはそのまま維持する...
(ここで resetOnError: true, オプションを指定すると、サーバーサイドでの呼び出しに失敗した場合に auth.reset() が処理され、ローカルストレージが初期化されてログアウトされてしまう)
さて... ログアウトされるのはいいとして..... でも、ここでリフレッシュのタイミングが来たあとに再読み込みすると、新しいユーザーデータが payload を含むトークンと一緒に返される..
payload のデータを受け取って新しいローカルストレージに書き込むのはいいんだ!
でも、ヘッダーにリフレッシュされた認証トークンが送られてくるのに、このやつを !! 捕まえて !! Authに新しいトークンとして設定しなければならないのに、それができない...
プラグインにAxiosを組み込んで、サーバーから呼び出したときに、返ってきたレスポンスをそのままAuthに登録させようと考えた.. でも.. うまくいかない..
理由がわからない...
これから調べてみるつもりだ..
プラグインで ssr: true にしても、Authは使えないのに..
https://auth.nuxtjs.org/api/options.html#plugins
https://auth.nuxtjs.org/recipes/extend.html
ここで確認した。Authにプラグインを直接追加した場合は使えるそうだ..
そうして、プラグインからAuthを使えることは確認できたが、この場合はAxiosがサーバーサイドでは動作しないという問題が発生する.. (なぜ..?)