我一直在尝试使用axios向我的项目控制器提交发布请求,但我不断收到错误419(未知状态)。即使我将CSRF通过标头传递给控制器。发布后进入“网络”标签时,它说:
X-CSRF-TOKEN: undefined
X-Requested-With: XMLHttpRequest
但是,当我console.log(window.csrf_token)时,它会返回一个令牌。
这包含在我的layout.blade.php中
<script type="text/javascript">
window.csrf_token = "{{ csrf_token() }}"
</script>
我在app.js中为vue定义标题:
const axios = require('axios');
axios.defaults.headers.common = {
'X-CSRF-TOKEN': window.csrf_token,
'X-Requested-With': 'XMLHttpRequest',
};
在我的项目中。这是我的axios帖子请求:
Swal.queue([{
title: 'Add a New Project?',
input: 'text',
inputAttributes: {
autocapitalize: 'on'
},
showCancelButton: true,
confirmButtonText: 'Create Project',
showLoaderOnConfirm: true,
preConfirm: (result) => {
return new Promise(function(resolve, reject) {
if (result) {
console.log(result)
axios.post('/api/projects', {title:result})
.then(function(response){
Swal.insertQueueStep({
type: 'success',
title: 'Your project has been created!'
})
resolve();
})
.catch(function(error){
Swal.insertQueueStep({
type: 'error',
title: 'Something went wrong.'
})
console.log(error);
reject();
})
}
});
}
}])
以及ProjectsController.php中的store方法
public function store()
{
$validated = request()->validate([
'title' => 'required',
]);
Project::create($validated);
return response()->json($validated);
}
答案 0 :(得分:2)
很可能是您在使用后在布局文件中设置CSRF令牌,因此未定义的原因。
尝试使用默认方式,即在您的主模板的meta
中放置一个head
标签,如下所示:
<meta name="csrf-token" content="{{ csrf_token() }}">
然后使用它可以打开已设置此代码的给定bootstrap.js
文件:
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
let token = document.head.querySelector('meta[name="csrf-token"]');
if (token) {
window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}
或者如果不存在,则将其放在您的app.js
脚本中或在每个页面上使用的任何脚本。