将 JSON 从 Laravel 5.1 控制器传递到 JS (AngularJS) 被单引号破坏答案

【问题标题】：Passing JSON from Laravel 5.1 Controller to JS (AngularJS) is Broken by Single Quotes将 JSON 从 Laravel 5.1 控制器传递到 JS (AngularJS) 被单引号破坏
【发布时间】：2017-07-04 15:43:23
【问题描述】：

在我们的遗留代码中，来自 Laravel 控制器的数据被发送到视图以供 Javascript 使用：

$scope.users = JSON.parse('{!! $users or "{}" !!}');

您可以想象，由于它将数据作为由单引号括起来的大 JSON 字符串引入，因此如果数据中包含单引号，则会中断。

我将更新我们的工作方式，但在开始这样的探索之前，我想看看要记住哪些方法或最佳实践，并想知道其他人如何将数据从 Laravel 控制器引入到视图中的 Javascript。

我已经尝试过其他方法，例如使用 PHP 的 addlashes() 和 htmlentities()，但这些方法看起来很笨拙，而且可能需要更多的步骤。如何最好地从 Laravel 转换或编码这些数据？

【问题讨论】：

您是否使用$http 来检索您的用户列表？如果是这样，它将自动解析它接收到的 JSON（假设您使用 application/json 标头发送它）。

标签： javascript angularjs json laravel-5

【解决方案1】：

将数据从您的模板语言直接插入到 javascript 文件中并不是最好的主意。将用户数据加载到 Angular 中的一种更好的方法是，从 API 端点提供数据，而且巧合的是总体上更好的可扩展性。然后，您使用 Angular 的 $http（或 $resource）从分配视图的 url 中检索数据并将其加载到您的控制器中。

angular.module('app').controller(function($http, $scope) {
    $http.get('/api/v1/users/', function(response) {
        $scope.users = response.data;
    })
})

但是，如果您必须，您可以使用ng-init 指令将数据插入您的控制器：

<body ng-controller="exampleCtrl" ng-init="users = {!! $users or "{}" !!}">
    <!--- the rest of your html --->
</body>

【讨论】：

很好的建议，但正如我在问题中所说，数据来自 Laravel 控制器。这是为页面操作和准备数据的地方，并通过以下方式传递给视图：return View::make('users',get_defined_vars()); 所以我真的需要一种将数据从 Laravel 控制器带到 Javascript 的方法。
我不是 100% 熟悉 Laravel（甚至不是 1%），但我对模板引擎很熟悉：使用模板将数据插入 Javascript 是自找麻烦。您最好设置一个专门为您需要的 JSON 提供服务的视图。
不同之处在于 Laravel 控制器有我需要的数据。我知道我可以在 Laravel 中使用路由直接通过 Ajax 访问 Laravel 控制器并以这种方式获取数据，但这意味着在 Laravel 控制器中创建一个重复函数以将数据提供给 Ajax，因为已经有一个控制器提供数据当 Laravel 构建和交付页面时。