Angular2 Http Laravel CSRF 令牌

Question

通过一些 Angular2 教程并试图让 post 请求在 Laravel 5.2 中工作我添加了这个元标记：

    <meta name="csrf-token" content="{{ csrf_token() }}">

但我不确定如何在 headers 部分传递它，或者老实说它是否应该传递给它。

    let headers = new Headers({ 'Content-Type': 'application/json', 'X-CSRF-TOKEN': '???????' });

更新：所以我添加了一个函数来从元标记中提取 csrf-token，但仍然没有找到将其传递给 Laravel post 请求的方法。

    getToken() {
      let token = document.querySelector('meta[property="csrf-token"]')['content'];
      return token;
   }

谢谢

Answer 1

这应该与 <title>{{ title() }}</title> 相同 "problem"：没有 component。这意味着：Angular不会t/can在这里做任何插值。对于 title 标签，angular 团队提供了可注入的 Title 服务。对于 meta 标签，您必须推出自己的解决方案。

看这里：https://wijmo.com/blog/how-to-improve-seo-in-angularjs-applications/

他们使用 document.querySelector 访问 meta 元素，然后 setAttribute 操作其内容。

Answer 2

这就是我所做的。不确定这是否是最好的方法，但确实有效。

在主 Laravel 模板中，我添加了这个元标记。

    <meta property="csrf-token" name="csrf-token" content="{{ csrf_token() }}">

在 Angular2 中 whatever.service.ts 我添加了一个获取令牌功能。

getToken() {
  let token = document.querySelector('meta[property="csrf-token"]')['content'];
  return token;
  }

在同一服务中，我将此添加到 post 方法。

let headers = new Headers({ 'Content-Type': 'application/json', 'X-CSRF-TOKEN': this.getToken()});

Laravel 现在接受 post 而没有 500 令牌不匹配错误

如果有更好的解决办法请指教！！

Angular2 Http Laravel CSRF 令牌

Angular2 Http Laravel CSRF Token

http-headers

laravel-5

angular