React (JSX) 中的 CSRF 字段

如何解决React (JSX) 中的 CSRF 字段

在 Laravel Blade 中，我们通过将 @CSRF 放在表单中来访问 CSRF 字段。我想做的是访问 React JSX 中的 CSRF 字段而不是 Blade。我在 React js - Laravel 5: Using csrf-token in POST method 上找到了答案，但我想知道是否有更好的方法来做到这一点。

如何以最佳方式将 CSRF 字段放入 (React) JSX 中的表单中？

解决方法

您提到的答案是在 react（即 javascript）内使用 csrf 的首选方法。如果我是对的。

虽然如果您使用的是 axios，那么您可以将令牌添加到 axios 全局。

//in your main layout file     
<meta name="csrf-token" content="{{ csrf_token() }}" />

如果对任何请求使用axios（这必须在所有页面的公共脚本文件中）

// I am using jquery,you can do it in vanilla too 
axios.defaults.headers.common['X-CSRF-TOKEN'] = $(
  'meta[name="csrf-token"]'
).attr('content');

对于 csrf 中的 jsx，如果您的所有页面都有通用的 js 文件

加入：let csrfToken = $('meta[name="csrf-token"]').attr('content');

在JSX中的表格中，这样使用

<input type="hidden" name="_token" value={csrfToken} />