Vue.js 2 Web Development Projects

Initializing user authentication

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 => ...