javascript - Laravel 路由的 Javascript 中的全局变量 - 这是个好主意吗？

Question

我使用 View Composer 创建了一些代码，将我的路线集合传递到所有 View 的前端，这样我就可以通过与它们关联的命名路线来访问 Vuejs 中的所有 Laravel 路线。

例如，要使用 vue 组件上传图像，不要将我的上传路由传递到 Vue 组件，而是将其列为全局变量的一部分:

var uploadRoute     = _.find(globalRoutes, function(route) { return route.name == 'route-name.image.upload' });
$.post(uploadRoute, data) ... etc

我的问题是......这合理吗？我正在公开发布我的整个应用程序的路线。

谢谢

Answer 1

我认为您关于公开整个应用程序路线的预感是合理的。 IMO 你应该明确选择你需要的路线。因此，在这种情况下，您应该只公开 route-name.image.upload。您可以创建一个小型辅助函数来查找路由并将其与 URL 一起输出为 JSON。

function json_routes(array $routes)
{
   $return = [];

   foreach($routes as $route)
   {
       $return[$route] = route($route);
   }

   return new \Illuminate\Support\HtmlString(json_encode($return));

}

在你的主视图中:

var routes = {{ json_routes(["route-name.image.upload"]) }};

获取路线很简单:

routes['route-name.image.upload']; 

这是我能想到的最基本的例子。您可以对其进行相当多的优化。只是一些想法:

• 将路线放在中心位置，fx。配置元素:json_routes(config('app.json_routes'))
• 构建一个生成静态 .json 文件的命令，这样您就不会在每个页面加载时迭代路由。添加更多路线时请记住重新生成。

• 创建一个函数而不是一个对象来获取路线。这允许您构建逻辑并在 js 中提供更像 Laravel 的感觉: function route(path){ return window.routes.hasOwnProperty(path) ? window.routes[path] : null ;}

• (高级) 重写 Laravels 路由器逻辑并 Hook 到选项数组，允许您执行类似 Route::get('dashboard', '.. .', ['as'=>'dashboard', 'expose'=>true]);，然后使用 expose 选项在所有路由上动态生成前面提到的 json 文件.