首页 > 解决方案 > Laravel PUT 响应错误 419。令牌被添加到标题中。我仍然没有结果

问题描述

我正在尝试使用 Fetch API 和 Laravel (5.5/5.6) 来放置一些正文(数据或文件)。我收到错误 419(未知状态),同时我将 CSRF 令牌添加到标头中(因为我需要它)。在我的示例中,我将范围最小化,以便于查找原因。

提取时出现问题(我没有得到任何结果:所以result.ok不行)。

我看到很多人因为令牌而遇到同样的问题。但在我的示例中,我确实使用了令牌,但在获取方面仍然存在问题。我的代码有什么问题?

路线 (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');

刀片(资源\视图\test.blade.php)

<!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>

仅供参考:我确定x-csrf-token标题中存在(请参见下面的屏幕截图): 在此处输入图像描述

标签: javascriptphplaraveltokenfetch

解决方案


您所要做的就是将您的 api 路由从 web.php 文件移动到 api.php 文件,因为 laravel 为每个文件使用不同的中间件 https://laravel.com/docs/4.2/routing#basic-routing


推荐阅读