ITの隊長のブログ

ITの隊長のブログです。Rubyを使って仕事しています。最近も色々やっているお(^ω^ = ^ω^)

nuxt authモジュールのcookie schemaとcookieのHttpOnly属性は相性が悪いらしい

スポンサードリンク

nuxt authモジュールでマルチログインを対応したくて色々試行錯誤しているところです。

www.aipacommander.com

で、バックエンド側でcookieの名前を変更できるようにする&セッションストレージを2つ用意できるようにしたところで、nuxt側でどうやって1つめ、2つめのセッションかを把握することができるのかしら?とドキュメントやnuxt auth自体のコードを読み漁ってました。

auth.nuxtjs.org

github.com

探してみると、nuxt.config.jsでの cookieauth.storage_name.cookie.name で指定したkeyがあり、その中身があれば $auth.loggedIn がtrueになるようでした。

おっけー、これでやろうって思って試したら、なんとバックエンド側でログインは成功するのですが、フロントエンドではログイン画面からリダイレクトしてくれません。なぜ???

リダイレクトの処理で、$auth.loggedIn がtrueじゃないとダッシュボードへ遷移しないようなmiddlewareを書いていたのですが、それがfalseでずっとログインページから動けないようです。なぜ???

chromeのdevelopertoolsで色々確認していると、 バックエンドから発行してもらっているcookieにHttpOnly属性がついているため、 document.cookiecookieが取れないのが原因なようです。なるほど。。。

issueを漁ってみたら、ビンゴでした。

github.com

ただ、対応策がいまいちよくわかっていないのですが、僕がまとめるとしたら

  • XSS対策でHttpOnly属性はつけておくべき(ただこれだけでは防げないことに注意)
  • nuxt側でcookieが参照できないので、page移動毎にバックエンドへfetchUserを実行して値が取れるか(認証済みか)確認する
    • 401が帰ってきたら、ログインページへリダイレクト

という認識です(英語よめないから多分そうだろうって感じですが、セキュアな話題なのでもし間違ってたら誰かコメントください)