Cannot change session in button callback

[Shmuma]

Hi!

I might be missing something, but for some reason, session is not preserved if I modify it inside the button callback.

This code shows "Storing" message in console, but token value is not preserved.
If I move session modification to the page function, everything works.

from fastapi import FastAPI
from nicegui import ui
from starlette.requests import Request
from starlette.middleware.sessions import SessionMiddleware

app = FastAPI()
app.add_middleware(SessionMiddleware, secret_key="my_secret")


@ui.page("/path")
def view_path(request: Request):
    v = request.session.get("token")
    ui.label(f"Token: {v}")
    ui.button("Back", on_click=lambda: ui.open("/"))


@ui.page("/")
def view_root(request: Request):
    def do_click():
        request.session["token"] = "token_v"
        print(f"Storing: {request.session}")
        ui.open("/path")
    ui.label("Index page")
    ui.button("Push me", on_click=do_click)


ui.run_with(app)

[rodja]

Oh yes. Great you bring it up. That one also bit me once, but I have not documented it before. Here is what happens:

1. the SessionMiddleware provides the "session" property to the request before entering your page creator
2. after the page is created (eg. when the function is complete) the SessionMiddleware grabs the session property and encodes the data into the response to the browser
3. modifying the session property on button click happens after the response is already send; so it can not update the browser cookie anymore

You see, it's totally logical :-) But when working with NiceGUI you expect every state to be magically synced to the client. Unfortunately here you are not using any NiceGUI functionality but rather the underlying SessionMiddleware which does not know about the websocket ...

I just added a note to the authentication demo code which also references this issue:

nicegui/examples/authentication/main.py

Lines 37 to 39 in 7143c14

	# NOTE we navigate to a new page here to be able to modify the session cookie (it is only editable while a request is en-route)
	# see https://github.com/zauberzeug/nicegui/issues/527 for more details
	ui.button('', on_click=lambda: ui.open('/logout')).props('outline round icon=logout')