search

cloudnativedaysjp / dreamkast-ui

MIT License
7 stars 2 forks source link

fix: Move AuthProvider to the RootApp to share between all page components #505

Closed hrk091 closed 3 months ago

hrk091 commented 3 months ago

safariで3rd party tracking cookie blockingが有効なブラウザで、infoやcheck_in_event にアクセスすると /authroizeが都度走ってしまい /ui にredirectされる件の対処です。

そもそも、上記の事象は、

  1. 各pageにアクセスしたときに、access_tokenの取得処理（/authorizeのcall）が走ってしまう
  2. 3rd party cookieがblockされると、auth0 libraryのgetTokenSilentlyが通らない
  3. redirectを伴う再認証処理が走ってしまう

が原因です。 一方で、初回アクセス時に認証してaccess_tokenは取得済であり、そもそも1で /authorize のcallが走ることがよくないです。 これは、各pageごとにwithAuthProviderを実行しており、pageの切替時にAuthProviderがdestroy-and-recreateされてしまっているからです。

NextjsのPageRouterを使っている場合、_app.tsxで定義されているtop levelのRootAppであれば、pageを切り替えても引き継がれます。AuthProviderの実行をここに移すことで、pageを切り替えてもstateが維持され、/authorizeのcallが実行されないようにしました。

この対応により、safariでも/info が表示できることを確認しました。

1点、今回の対応により無認証のページが表示できなくなっています。 ただ、これに関しては別の方式で対応すべきであり、pageを切り替えても認証状態は維持される方が望ましいので、今回の対応は無認証ページが混在する場合でも導入するべきと考えます。

github-actions[bot] commented 3 months ago

Review app