I’m, using the authentication system provided by phx.gen.auth, and am generally pretty happy with it. However, I’m experiencing issues when I have more than one tab open.

To reproduce, simply open two tabs, log in to the first and then log in again in the second tab. The result is a Plug.CSRFProtection.InvalidCSRFTokenError. Here is the log output when running mix phx.server:

[info] POST /accounts/log_in
[debug] Processing with SorgenfriWeb.UserSessionController.create/2
  Parameters: %{"_csrf_token" => "BQEcEBFGMAU6By4DfTYTCCMfcx0PPR4yvwYZTvZcbIb6LgvFQH1DgGRq", "account" => %{"email" => "philip@munksgaard.me", "password" => "[FILTERED]", "remember_me" => "false"}}
  Pipelines: [:browser, :redirect_if_user_is_authenticated]
[info] Sent 403 in 19ms
[debug] ** (Plug.CSRFProtection.InvalidCSRFTokenError) invalid CSRF (Cross Site Request Forgery) token, please make sure that:

  * The session cookie is being sent and session is loaded
  * The request include a valid '_csrf_token' param or 'x-csrf-token' header
    (plug 1.15.3) lib/plug/csrf_protection.ex:316: Plug.CSRFProtection.call/2
    (sorgenfri 0.1.0) SorgenfriWeb.Router.browser/2
    (sorgenfri 0.1.0) lib/sorgenfri_web/router.ex:1: SorgenfriWeb.Router.__pipe_through1__/1
    (phoenix 1.7.11) lib/phoenix/router.ex:475: Phoenix.Router.__call__/5
    (sorgenfri 0.1.0) lib/sorgenfri_web/endpoint.ex:1: SorgenfriWeb.Endpoint.plug_builder_call/2
    (sorgenfri 0.1.0) deps/plug/lib/plug/debugger.ex:136: SorgenfriWeb.Endpoint."call (overridable 3)"/2
    (sorgenfri 0.1.0) lib/sorgenfri_web/endpoint.ex:1: SorgenfriWeb.Endpoint.call/2
    (phoenix 1.7.11) lib/phoenix/endpoint/sync_code_reload_plug.ex:22: Phoenix.Endpoint.SyncCodeReloadPlug.do_call/4
    (plug_cowboy 2.7.0) lib/plug/cowboy/handler.ex:11: Plug.Cowboy.Handler.init/2
    (cowboy 2.10.0) /home/munksgaard/src/sorgenfri/deps/cowboy/src/cowboy_handler.erl:37: :cowboy_handler.execute/2
    (cowboy 2.10.0) /home/munksgaard/src/sorgenfri/deps/cowboy/src/cowboy_stream_h.erl:306: :cowboy_stream_h.execute/3
    (cowboy 2.10.0) /home/munksgaard/src/sorgenfri/deps/cowboy/src/cowboy_stream_h.erl:295: :cowboy_stream_h.request_process/3
    (stdlib 4.3.1.3) proc_lib.erl:240: :proc_lib.init_p_do_apply/3

I’m pretty sure the problem has to do with the fact that the session cookie has been updated in another tab, but not in this one (since log_in is a liveview process), but I am unsure how best to solve it.

A similar error happens if I log out of one tab and then quickly attempt to log out of another before the disconnected liveview forces a refresh.

I think this issue is related to both User authentication across multiple tabs with LiveView and Log out causes "attempting to reconnect" messages on additional browser tabs - #4 by RobertoSchneiders, and the solution might be similar. However, it seems a bit strange to me that the default behavior does not handle multiple tabs better. How have other people handled this issue?