当前位置: 首页 > 面试题库 >

如何使用Laravel API在AngularJS表单中发送csrf_token()?

邢高澹
2023-03-14
问题内容

我正在尝试构建一个angular + laravel rest应用程序。我可以获得数据库的视图。当我尝试添加新项目时。我500 error告诉我不匹配的csrf令牌。我的表单布局是:

<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项目的源代码感兴趣。



 类似资料:
  • 问题内容: 我正在开发使用不同服务其余部分的图形界面(用Java编写)。我必须调用这样的服务: 呼叫服务: 当我从Angularjs服务文件中请求时,如果服务具有Content-Type = multipart / form- data,则会收到错误400(错误请求) 如果服务的Content-Type =“ application / x-www-form-urlencoded; charset

  • 我有一个使用Xamarin.Forms的应用程序,针对IOS,Android和WP 8。 我的应用中需要推送通知功能。 我看过<code>pushsharp</code>演示,它似乎很有前途。但我看到的所有代码都是针对每个平台分别编写的。 我希望这件事能在法庭上进行。Forms项目,在App.cs中的某个地方,这样我就不需要重复注册设备的代码,也不需要处理应该如何处理推送通知。 任何帮助都将不胜感

  • 问题内容: HTML: 用于侦听输入[type = file]的自定义指令更改: 选择文件后,控制台中将显示以下错误: 错误:InvalidStateError:DOM异常11错误:试图使用一个不可用或不再可用的对象。 尝试使用plunkr:http ://plnkr.co/edit/C5j5e0JyMjt9vUopLDHc?p=preview 没有该指令,输入文件字段的状态将不会被推送到form

  • 问题内容: 我有一个资源“角色”,它与“用户”有很多关系。要管理“角色”,我需要将角色ID和用户ID发送到服务器,以便从正确的用户(不一定是已登录的用户)中删除角色。 这是我正在尝试的方法,但是根据文档,这是不可能的。我知道我可以在uri中发送两个id,但是我的laravel后端会自动设置一个资源丰富的resource / {resourceid}路由,我希望在可能的情况下使用它。有没有办法做到这

  • 问题内容: 所以我有这个HTML表单: 当用户单击“提交”时,哪种形式最简单的方法将此表单的数据作为JSON对象发送到我的服务器? 更新:我已经走了这么远,但似乎没有用: 我究竟做错了什么? 问题答案: 获取完整的表单数据作为数组,并对其进行json字符串化。 您可以稍后在ajax中使用它。或者,如果您不使用ajax;将其放在隐藏的文本区域中并传递到服务器。如果此数据通过常规格式数据作为json字

  • 问题内容: 我正在尝试使用Jetty将带有RestTemplate的文件上传到Raspberry Pi。在Pi上,正在运行一个servlet: 我能够成功卷曲 这是应该在webapp上具有相同功能的方法。 这是我得到的输出: ui-elements.html上传了! org.springframework.web.multipart.support.StandardMultipartHttpSer