When the page load and the application start, we need to check if the user is already connected. For this reason, the server has a /user path that returns the user object if they are logged in. We will put it in the global state just like if we logged in. Then, we will start the Vue app:

1. In the main.js file, import $fetch from our plugin:

      import VueFetch, { $fetch } from './plugins/fetch'

2. Then we need to create a new asynchronous function called main, inside of which we will request the user data and then start the app:

      async function main () {
        // Get user info
        try {
          state.user = await $fetch('user')
        } catch (e) {
          console.warn(e)
        }
        // Launch app
        new Vue({
          el: '#app',
          data: state,
          router,
          render: h => h(AppLayout),
        })
      }

      main()

Now if you log in and then you refresh the page, you should still be connected!