How to send csrf_token() inside AngularJS form using Laravel API?
angularjs, csrf-protection, laravel
Solution
An option will be to inject the CSRF token as a constant. Append the following in your head tag:
<script>
angular.module("app").constant("CSRF_TOKEN", '{{ csrf_token() }}');
</script>
Then in your module methods it can be injected when needed.
app.factory("FooService", function($http, CSRF_TOKEN) {
console.log(CSRF_TOKEN);
};
Maybe you will be interested of peeking at the source code of this sample Laravel + AngularJS project.
Problem
I am trying to build an angular + laravel rest application. I can get the views of my database. When I try to add new items. I get `500 error` telling me mismatch csrf token. My form layout is : ``` <form class="form-horizontal" ng-submit="addItem()"> <input type="text" ng-model="itemEntry" placeholder="Type and hit Enter to add item"> </form> ``` This is how I try to add item to database : ``` $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); }); } ``` Here is my filter that I use for my application: ``` Route::filter('csrf', function() { if (Session::token() != Input::get('_token')) { throw new Illuminate\Session\TokenMismatchException; } }); ``` In my blade views I use this and it works : ``` <input type="hidden" name="_token" value="{{ csrf_token() }}" /> ``` How can I send the csrf_token when I use html forms? Thanks Edit 1 : Adding header to post request like this does not give errors. ``` $http({ method : 'POST', url : '/shop', data : $scope.itemEntry, // pass in data as strings headers : { 'Content-Type': 'application/x-www-form-urlencoded' } }); ```