VueJS 字符串化路由

Question

动态完全加载路由器路由的安全最佳做法是什么？

从后端检索所有路由并使用 router.addRoutes 而无需在客户端对其进行硬编码？
创建普通路由并通过它们过滤？（这不会仍然有完整的路由器路由在客户端可用于恶意访问吗？）

我读到 here 1. 是建议的方法，但我不明白在映射组件方面需要做什么。您不能 JSON.stringify 路由的组件属性因为它是一个函数。让我们使用一个路由器片段示例：

{
    path: '/employees',
    component: () => import('@/layout'),
    redirect: '/employees/master',
    name: 'Employees',
    alwaysShow: true,
    meta: {
      title: 'Employees',
      icon: 'user',
      roles: ['Admin'] // you can set roles in root nav
    },
    children: [
      {
        path: 'master',
        component: () => import('@/views/employees/master.vue'),
        name: 'Master',
        children: [
          {
            path: '',
            name: 'MasterIndex',
            component: () => import('@/views/employees/views/index.vue'),
            meta: { title: 'Master', noCache: true, icon: 'user' }
          },

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

Answer 1

没关系，找到解决方案 here。提供更多背景信息：

将组件的字符串部分保存到映射中，取回字符串并传递给客户端函数的创建。然后将函数附加到路由。我并没有立即想到要分离关注点而不是整体处理组件。

VueJS 字符串化路由

VueJS stringify routes

sql

stringify

vue.js

vue-router

vue-component