我正在尝试构建一个angular + laravel rest应用程序。我可以获得数据库的视图。当我尝试添加新项目时。我500 error告诉我不匹配的csrf令牌。我的表单布局是:
500 error
<form class="form-horizontal" ng-submit="addItem()"> <input type="text" ng-model="itemEntry" placeholder="Type and hit Enter to add item"> </form>
这就是我尝试将项目添加到数据库的方法:
$scope.addItem = function(CSRF_TOKEN) { $http.post('/shop', { text: $scope.itemEntry, csrf_token: CSRF_TOKEN} ).success(function(data, status) { if(data) { var last = _.last($scope.items); _token = CSRF_TOKEN; $scope.items.push({text: $scope.itemEntry, bought: false, id: (last.id + 1) }); $scope.itemEntry = ''; console.log($scope.items); } else { console.log('There was a problem. Status: ' + status + '; Data: ' + data); } }).error(function(data, status) { console.log('status: ' + status); }); }
这是我用于应用程序的过滤器:
Route::filter('csrf', function() { if (Session::token() != Input::get('_token')) { throw new Illuminate\Session\TokenMismatchException; } });
在我的刀片视图中,我使用了它并且有效:
<input type="hidden" name="_token" value="{{ csrf_token() }}" />
使用html表单时如何发送csrf_token?
谢谢
编辑1:像这样添加标题到发布请求不会产生错误。
$http({ method : 'POST', url : '/shop', data : $scope.itemEntry, // pass in data as strings headers : { 'Content-Type': 'application/x-www-form-urlencoded' } });
一种选择是将CSRF令牌作为常量注入。在您的head标签中添加以下内容:
<script> angular.module("app").constant("CSRF_TOKEN", '{{ csrf_token() }}'); </script>
然后在您的模块方法中可以在需要时将其注入。
app.factory("FooService", function($http, CSRF_TOKEN) { console.log(CSRF_TOKEN); };
也许您会对看一下示例Laravel + AngularJS项目的源代码感兴趣。