如何发送使用Laravel API AngularJS表单内csrf_token（）？ [英] How to send csrf_token() inside AngularJS form using Laravel API?

问题描述

我想建立一个角+ laravel休息应用。我可以让我的数据库的意见。当我尝试添加新的项目。我得到 500错误告诉我错配CSRF令牌。
我的布局形式是：

 ＆LT;窗​​体类=形横NG提交=的addItem（）＆GT;  ＆LT;输入类型=文本NG模型=itemEntry占位符=类型，然后按Enter添加项目＆GT;
＆LT; /表及GT;
 

这是我尝试项添加到数据库：

  $ scope.addItem =功能（CSRF_TOKEN）{
    $ http.post（'/店'，{文字：$ scope.itemEntry，csrf_token：CSRF_TOKEN}）.success（功能（数据，状态）{
        如果（数据）{
            VAR最后= _.last（$ scope.items）;
            _token = CSRF_TOKEN;
            $ scope.items.push（{文字：$ scope.itemEntry，买了：假的，ID：（last.id + 1）}）;
            $ scope.itemEntry ='';
            的console.log（$ scope.items）;
        }其他{
            的console.log（'出现了问题状态：+状态+';数据：'+数据）;
        }
    }）错误（功能（数据，状态）{
            的console.log（'状态：'+状态）;
        }）;}
 

下面是我的过滤器，我用我的应用程序：

 路线::过滤器（'CSRF'，函数（）
{
    如果（会话令牌::（）！=输入::得到（'_令牌'））
    {
        抛出新照亮\\会议\\ TokenMismatchException;
    }
}）;
 

在我的刀锋的看法我用这个和它的作品：

 ＆LT;输入类型=隐藏的名字=_标记值={{csrf_token（）}}/＆GT;
 

我怎么能发送csrf_token当我使用HTML表单？

感谢

编辑1：
添加头POST请求这样不给错误。

  $ HTTP（{
    方法：POST，
    网址：'/店铺'，
    数据：$ scope.itemEntry，//传递数据串
    标题：{内容类型：应用程序/ x-WWW的形式urlen codeD'}
  }）;
 

解决方案

这是选项将注入CSRF令牌作为一个常数。附加以下在你的脑袋标记：

＆LT;脚本＆GT;
  angular.module（应用程序）常数（CSRF_TOKEN，{{csrf_token（）}}'）。
＆LT; / SCRIPT＆GT;


然后在你的模块的方法，可以在需要的时候注入。

app.factory（FooService接口功能（$ HTTP，CSRF_TOKEN）{
    的console.log（CSRF_TOKEN）;
};


也许你会有兴趣在这个样本Laravel + AngularJS项目的源$ C ​​$ C的偷看。

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' }   
  });

解决方案

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.

这篇关于如何发送使用Laravel API AngularJS表单内csrf_token（）？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！