如何解决如何获取Laravel CSRF令牌以通过React中的获取后请求发送它?
我正在使用 create-react-app 和Laravel开发网络应用。 create-react-app 在localhost:3000上运行开发项目,而laravel后端在localhost:8080上运行。这是我的代码的一部分:
const onSubmit = (e) => {
e.preventDefault();
const val = rootRef(formRef); // React ref to form
// form data
const data = {
firstName: val('firstName'),lastName: val('lastName'),facultyId: val('facultyId'),departmentId: val('departmentId'),courseNo: val('courseNo'),phoneNumber: val('phoneNumber'),emailInput: val('email'),password: val('password')
}
const request = {
method: "POST",// mode: "cors",// cache: "no-cache",headers: {
"Content-Type": "application/json"
},body: JSON.stringify(data)
}
fetch('http://localhost:8080/signup',request)
.then(res => res.json())
.then(console.log)
}
因此,当我提交表单时,我得到 419个未知状态。我阅读了laravel文档,发现发生了这种情况,因为POST请求不包含 csrf 令牌。 Laradocs说(对于axios):
如果您不使用此库,则需要为应用程序手动配置此行为
但是如何为基于 create-react-app 的项目做同样的事情?
解决方法
将其放置在主刀片视图中
<meta name="csrf-token" content="{{ csrf_token() }}">
然后,通过JS捕获csrf令牌值,并将其传递到标头中
const token = document.head.querySelector('meta[name="csrf-token"]');
headers: {
"Content-Type": "application/json".
"X-CSRF-TOKEN'": token
},
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。