introduce handshake message to improve client reload behavior

nicegui/nicegui.py

@@ -79,15 +79,16 @@ async def exception_handler(request: Request, exception: Exception):
     return client.build_response(request, 500)
 
 
-@sio.on('connect')
-async def handle_connect(sid: str, _) -> None:
+@sio.on('handshake')
+async def handle_handshake(sid: str) -> bool:
     client = get_client(sid)
     if not client:
-        return
+        return False
     client.environ = sio.get_environ(sid)
     sio.enter_room(sid, str(client.id))
     with client:
         [safe_invoke(t) for t in client.connect_handlers]
+    return True
 
 
 @sio.on('disconnect')

nicegui/templates/index.html

@@ -90,6 +90,11 @@
           const query = { client_id: {{ client_id }} };
           const url = window.location.protocol === 'https:' ? 'wss://' : 'ws://' + window.location.host;
           window.socket = io(url, { path: "{{ prefix | safe }}/ws/socket.io", query });
+          window.socket.on("connect", () => {
+            window.socket.emit("handshake", (ok) => {
+              if (!ok) window.location.reload();
+            });
+          });
           window.socket.on("update", (msg) => {
             Object.entries(msg.elements).forEach(([id, element]) => this.elements[element.id] = element);
           });
@@ -97,7 +102,6 @@
           window.socket.on("run_javascript", (msg) => run_javascript(msg['code'], msg['request_id']));
           window.socket.on("open", (msg) => (location.href = msg));
           window.socket.on("notify", (msg) => Quasar.Notify.create(msg));
-          window.socket.on("disconnect", () => window.location.reload());
         },
       }).use(Quasar, {
         config: {