Laravel-Vue发布组件，应该通过身份验证加以保护。

Question

我是相对较新的Vue，并开始建立一个SPA与认证和Laravel的背景。为了达到这个目的，我遵循了本教程：

https://codeburst.io/api-authentication-in-laravel-vue-spa-using-jwt-auth-d8251b3632e0

这个酒馆运转得很好。但是，我现在的But是，使用auth保护的路由/组件也被捆绑在我的app.js中，并且对于所有能够使用开发控制台的人来说都是完全可读的。

示例

这是我的路线：

export default new VueRouter({
routes: [
    {
        path: '/',
        redirect: '/login',
    },
    {
        path: '/login',
        name: 'login',
        component: AuthLogin,
        meta: {
            auth: false
        },
    },
    {
        path: '/order',
        name: 'order',
        component: OrderPage,
        meta: {
            auth: true
        },
    },
  ]
});

因此，/order和相应的组件OrderPage列表由auth保护。OrderPage

<template>
  <div>
    Order Page
  </div>
</template>

但是，组件OrderPage在公共目录中的app.js中是可读的。我只需搜索“订购页”的内容，并阅读它，在我看来，这不是奥斯的目标。

是否有办法“隔离”受保护的组件，并且只在传递auth时导出/捆绑它们？我是不是遗漏了什么？

Answer 1

基于Auth的捆绑--您可能不是在动态绑定javascript .在客户访问您的站点之前很长一段时间，您都在转移和捆绑，所以不应该在通过auth时绑定。捆绑、转移和缩小可能是相当资源密集型的过程。

隔离用于安全--您可以将代码隔离到特定的javascript文件中，没有理由将所有内容都捆绑在同一个app.js文件中。Laravel可以根据您的配置生成多个包。

但是，从安全的角度来看，这是没有意义的，因为客户端代码应该永远不会包含任何敏感的内容，所有的操作授权都应该在服务器上执行。

产品可读性--如果你担心有人在读客户端代码，缩小的javascript是难以置信的难以破译的，因为它被缩小和混淆了。在没有源映射的情况下，生产javascript应该始终缩小。