How to detect on client side that the server side state for the process is closed?

Server side states have a timeout. If you want to show a message to the user when the client process state is closed, even if there is no request, use a channel and catch exception Eliom_comet.Process_closed.

Example:

(* call this function when starting the client process *)
  let start_process () =
    let c : unit Eliom_comet.Channel.t =
      Eliom_comet.Channel.create (fst (Lwt_stream.create ())) in
    ignore {unit{
        Lwt.async (fun () ->
          Lwt.catch (fun () ->
            Lwt_stream.iter_s
              (fun () -> Lwt.return ())
              %c)
            (function
              | Eliom_comet.Process_closed ->
                close_client_process ()
              | e ->
                Eliom_lib.debug_exn "comet exception: " e;
                Lwt.fail e))
      }}

Here is an example of implementation for function close_client_process:

{client{
let close_client_process () =
  let d = D.div ~a:[a_class ["ol_process_closed"]]
    [img ~alt:("Ocsigen Logo")
        ~src:(Xml.uri_of_string  
         "https://ocsigen.org/resources/logos/ocsigen_with_shadow.png")
        ();
     p [pcdata "Ocsigen process closed.";
        br ();
        a ~service:Eliom_service.void_coservice'
          [pcdata "Click"] ();
        pcdata " to restart."];
    ]
  in
  let d = To_dom.of_div d in
  Dom.appendChild (Dom_html.document##body) d;
  lwt () = Lwt_js_events.request_animation_frame () in
  d##style##backgroundColor <- Js.string "rgba(255, 255, 255, 0.9)";
  Lwt.return ()
}}

And an example of stylesheet:

/* Closed process */

div.ol_process_closed {

  position: fixed;

  height: 100%;

  width: 100%;

  background-color: rgba(255, 255, 255, 0);

  top: 0;

  left: 0;

  z-index: 10000000;

  transition: background-color 2s;

  -moz-transition: background-color 2s;

  -webkit-transition: background-color 2s;

  -o-transition: background-color 2s;

}



div.ol_process_closed img {

  position: fixed;

  right: 33%;

  top: 55%;

}

div.ol_process_closed p {

  position: fixed;

  left: 66%;

  top: 55%;

  padding: 80px 0 0 15px;

}