Javascript Laravel将响应放入错误419。令牌被添加到头中。我还是没有结果
我正在尝试使用FetchAPI和Laravel（5.5/5.6）将一些主体（数据或文件）放在一起。当我将CSRF令牌添加到头中时，出现错误419（未知状态）（因为我需要它）。在我的示例中，我最小化了范围，以便于找到原因 问题发生在获取时（我没有得到任何结果：因此Javascript Laravel将响应放入错误419。令牌被添加到头中。我还是没有结果,javascript,php,laravel,token,fetch,Javascript,Php,Laravel,Token,Fetch,我正在尝试使用FetchAPI和Laravel（5.5/5.6）将一些主体（数据或文件）放在一起。当我将CSRF令牌添加到头中时，出现错误419（未知状态）（因为我需要它）。在我的示例中，我最小化了范围，以便于找到原因 问题发生在获取时（我没有得到任何结果：因此result.ok不正常） 我看到很多人因为代币而遇到同样的问题。但在我的示例中，我确实使用了令牌，但仍然存在获取问题。我的代码怎么了 路由（routes\web.php） 您所要做的就是将api路由从web.php文件移动到api.ph
result.ok您所要做的就是将api路由从web.php文件移动到api.php文件
因为laravel对每个文件使用不同的中间件
您所要做的就是将api路由从web.php文件移动到api.php文件
因为laravel对每个文件使用不同的中间件
多亏了Znar（stackoverflow用户），我找到了解决方案。路由的API部分必须替换为API.php
：
routes\web.php
<?php
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;
Route::get('/test', function () {
return view('test');
});
Route::put('/test/put', function (Request $request) {
// PUT some stuff
return response()->json([
'feedback' => 'test result is ok!'
]);
})->name('test.put');
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Test</title>
</head>
<body>
<form id="test-form" method="post" action="{{ route('test.put') }}">
<input type="text" name="test" value="123" title="Test">
<button type="submit">Put</button>
</form>
<script>
(function () {
function getToken() {
let metas = document.getElementsByTagName("meta");
for (let i = 0; i < metas.length; i++) {
let meta = metas[i];
if (meta.name === "csrf-token") {
return meta.content;
}
}
}
function buildOptions(form) {
let formData = new FormData();
let testVal = form.querySelector('input[name="test"]').value;
formData.append("test", testVal);
let token = getToken();
let headers = new Headers({
'X-CSRF-TOKEN': token
});
return {
method: 'PUT',
body: formData,
headers
};
}
function putIt(form) {
let url = form.getAttribute('action');
let options = buildOptions(form);
fetch(url, options)
.then(response => {
if (response.ok) {
return response
}
throw new Error("Response is not ok");
})
.then(response => response.json())
.then(console.log)
.catch(err => console.error("Something went wrong", err))
}
document.getElementById('test-form').addEventListener('submit', function(e) {
e.preventDefault();
putIt(this);
});
})();
</script>
</body>
</html>
<?php
use Illuminate\Support\Facades\Route;
Route::get('/test', function () {
return view('test');
});
<?php
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;
Route::put('/test/put', function (Request $request) {
// PUT some stuff
return response()->json([
'feedback' => 'test result is ok!'
]);
})->name('test.put');
多亏了Znar（stackoverflow用户），我找到了解决方案。路由的API部分必须替换为API.php
：
routes\web.php
<?php
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;
Route::get('/test', function () {
return view('test');
});
Route::put('/test/put', function (Request $request) {
// PUT some stuff
return response()->json([
'feedback' => 'test result is ok!'
]);
})->name('test.put');
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Test</title>
</head>
<body>
<form id="test-form" method="post" action="{{ route('test.put') }}">
<input type="text" name="test" value="123" title="Test">
<button type="submit">Put</button>
</form>
<script>
(function () {
function getToken() {
let metas = document.getElementsByTagName("meta");
for (let i = 0; i < metas.length; i++) {
let meta = metas[i];
if (meta.name === "csrf-token") {
return meta.content;
}
}
}
function buildOptions(form) {
let formData = new FormData();
let testVal = form.querySelector('input[name="test"]').value;
formData.append("test", testVal);
let token = getToken();
let headers = new Headers({
'X-CSRF-TOKEN': token
});
return {
method: 'PUT',
body: formData,
headers
};
}
function putIt(form) {
let url = form.getAttribute('action');
let options = buildOptions(form);
fetch(url, options)
.then(response => {
if (response.ok) {
return response
}
throw new Error("Response is not ok");
})
.then(response => response.json())
.then(console.log)
.catch(err => console.error("Something went wrong", err))
}
document.getElementById('test-form').addEventListener('submit', function(e) {
e.preventDefault();
putIt(this);
});
})();
</script>
</body>
</html>
<?php
use Illuminate\Support\Facades\Route;
Route::get('/test', function () {
return view('test');
});
<?php
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;
Route::put('/test/put', function (Request $request) {
// PUT some stuff
return response()->json([
'feedback' => 'test result is ok!'
]);
})->name('test.put');
检查inspect上的请求头，看看是否有令牌被发送，这是CSRF令牌错误。当然，我已经检查过了。没关系<代码>x-csrf-token
出现在请求头中。唯一的问题是：标题名称没有大写。我甚至不确定这是否有问题。如果您将'\u method'：'put'
添加到FormData，会发生什么情况？请检查inspect上的请求标题，看看是否有令牌被发送。这是CSRF令牌错误。当然，我已经检查过了。没关系<代码>x-csrf-token
出现在请求头中。唯一的问题是：标题名不是大写的。我甚至不确定这是否有问题。如果在FormData中添加“\u方法”：“put”
，会发生什么？是的，好的。我也这么做。我只是不使用JQuery
。我的问题是关于fetchapi
。Fetch API
和纯JavaScript
（ECMA-6
）有什么问题吗？检查这个答案你所要做的就是将API代码放在API.php而不是web.phpweb.php中用于路由。你是什么意思？是的，web.php用于路由，而api.php用于api调用，laravel在api.php中挖掘令牌，所以你需要的是，好的。我也这么做。我只是不使用JQuery
。我的问题是关于fetchapi
。Fetch API
和纯JavaScript
（ECMA-6
）有什么问题吗？检查这个答案你所要做的就是将API代码放在API.php而不是web.phpweb.php中用于路由。你是什么意思？是的，web.php用于路由，而api.php用于api调用，laravel在api.php中挖掘令牌，以便满足您的需要