title: Write on session with Sapper and Svelte
body: <p>I wrote a Sapper app with session management following the <a href="https://github.com/sveltejs/realworld" rel="noreferrer">RealWorld example</a>:</p>
  
  <pre class="lang-js prettyprint-override"><code>polka()
    .use(bodyParser.json())
    .use(session({
      name: 'kidways-app',
      secret: 'conduit',
      resave: false,
      saveUninitialized: true,
      cookie: {
        maxAge: 31536000
      },
      store: new FileStore({
        path: 'data/sessions',
      })
    }))
    .use(
      compression({ threshold: 0 }),
      sirv('static', { dev }),
      pdfMiddleware,
      sapper.middleware({
        session: req =&gt; ({
          token: req.session &amp;&amp; req.session.token
        })
      })
    )
    .listen(PORT, err =&gt; {
      if (err) console.log('error', err);
    });
  </code></pre>
  
  <p>Then on my <code>_layout.sevlte</code>:</p>
  
  <pre><code>&lt;script context="module"&gt;
    export async function preload({ query }, session) {
      console.log('preload', session)
      return {
        // ...
      };
    }
  &lt;/script&gt;
  
  &lt;script&gt;
    import { onMount, createEventDispatcher } from 'svelte';
    import { Splash } from 'project-components';
    import * as sapper from '@sapper/app';
    import { user } from '../stores';
    import client from '../feathers';
  
    const { session } = sapper.stores();
  
    onMount(async () =&gt; {
      try {
        await client.reAuthenticate();
        const auth = await client.get('authentication');
        user.set(auth.user);
        $session.token = 'test';
      } catch (e) {
      } finally {
        loaded = true;
      }
    });
  
    console.log($session)
  &lt;/script&gt;
  
  &lt;h1&gt;{$session.token}&lt;/h1&gt;
  </code></pre>
  
  <p>This work on client side rendering, but the token is still undefined on preload, making my SSR template rendering broken.</p>
  
  <p>What did I missed?</p>