Vuejs combat Item four: check permissions

Jump route Reference document: https://router.vuejs.org/zh/guide/advanced/navigation-guards.html

Creating permission.js in the / src permissions check

And the global introduction of main.js in:

import './permission'
/ * * 
 * Permissions check: 
 * Pre-hook function beforeEach (to, from, next) Vue Router in 
 * Before routing jump, determination is made whether already logged in, then allow access to non-landed login page, otherwise back to the login page 
 * 
 * to: target route object about to enter the 
 * from: routing object is about to leave the 
 * next: is a method, you can specify the routing address, routing jump 
 * / 

Import Router from './router' 
{from} getUserInfo Import '@ / API / Login' 

router.beforeEach ((to, from, Next) => { 

    // 1. Get token 
    const = localStorage.getItem token ( 'MSM-token' )
     IF (! token) {
         // 1.1 If no response is received, access to non-login page, not to visit, go to the login page / the Login 
        IF (to.path! = '/ the Login' ) {
            Next ({path: '/ Login' }) 
        } the else {
             // request login page / Login 
            Next ({}) 
        } 
    } the else {
         // 1.2 to acquired token, 
        // 1.2.1 request routing / login, then go target route 
        iF (to.path === '/ Login' ) { 
            Next () 
        } the else {
             // 1.2.2 non login page request routing, first check whether the user information in the local 
            const userInfo = localStorage.getItem ( 'msm -user ' )
             IF (the userInfo) {
                 // local acquired, it directly to the target route
                 Next () 
            } the else {
                 // If the user information is not available locally, it is to acquire user information token 
                getUserInfo (token) .then (Response => { 
                    const RESP = response.data
                     IF (resp.flag) {
                         // If the acquired user information, the non-login page, or back to the login page 
                        // save to a local 
                        localStorage.setItem ( 'MSM-the user' , JSON.stringify (resp.data)) 
                        the Next () 
                    } the else {
                         // did not get to the user information, log back 
                        next ({path: '/ login ' }) 
                    }
                })
            }
        }
    }

})

 

Guess you like

Origin www.cnblogs.com/flypig666/p/11593109.html