Condivisione della tecnologia

Imposta alcuni percorsi in modo che siano accessibili pubblicamente e non richiedano lo stato di accesso per accedervi

2024-07-08

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Nei framework SPA (Single Page Application), come Vue.js, le protezioni dei percorsi sono una funzionalità molto utile che consente di controllare l'accesso ai percorsi. Vue.js utilizza Vue Router come gestore del percorso ufficiale. Le protezioni di instradamento si dividono principalmente in protezioni globali e protezioni intra-componente.

Ecco un esempio di come impostare una protezione del percorso per consentire l'accesso pubblico a determinati percorsi:

  1. Fronte di guardia globale: Nella configurazione di Vue Router, è possibile utilizzare beforeEach Il metodo imposta una protezione globale per verificare se l'utente ha effettuato l'accesso e reindirizzare l'utente in base allo stato di accesso.
// router/index.js
import Vue from 'vue';
import Router from 'vue-router';
import Home from '../components/Home.vue';
import Dashboard from '../components/Dashboard.vue';

Vue.use(Router);

const router = new Router({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/dashboard',
      name: 'Dashboard',
      component: Dashboard,
      meta: {
        requiresAuth: true // 标记需要认证的路由
      }
    }
    // 其他路由...
  ]
});

// 全局前置守卫
router.beforeEach((to, from, next) =