CakePHP3 ~ CSRF-token 在第二个函数上不匹配

Question

我目前正在开发一个使用 CakePHP 3 框架作为后端的可靠的 JavaScript 系统。我面板中的所有操作都在同一个页面/ url 上执行，它是一个单页应用程序。目前我得到了一堆函数，并决定是时候研究 CakePHP 3 的 CSRF 组件了。当我启用它时，我得到了 400 错误，表明没有给出 CSRF 令牌。经过大量研究后，我找到了解决方案，即通过 FormMaker 或在我的 JQuery ajax 请求中手动实现令牌来解决此问题。这很有效，所以我决定在下一个功能中也实现它。但正如您可能猜到的那样，这不起作用。第二个 ajax 请求给出了 CSRF 令牌不匹配。请看下面我的代码：

我的第一个实际可行的请求：

function getSectionData(controller, method = null) {
    fetch("<?=$this->Url->build(['controller' => '']);?>" + "/" + controller + "/getSectionData", {
            method: 'POST',
            headers: {
                "Content-Type": "application/json",
                "X-CSRF-Token": <?= json_encode($this->request->param('_csrfToken')); ?>
            },
            body: JSON.stringify({
                method: method
            })
        })
            .then((res) =>
                res.json())
            .then((data) => {
                console.warn(data);
                let response = data.response;

                if (response.success == 1) {
                    // Action to do when data has been received
                    let method = response.method;
                    let rows = response.rows;

                    window[method](controller, rows);
                } else if (response.success == 0) {
                    // Message when an error occures

                }

            })
            .catch((err) => console.log(err))
}

最终第二个功能在不到一秒后被激活：

function renderElement(element, id, data = null) {
    let path = "<?= $this->request->here; ?>" + "/renderElement/" + element;
    $('#' + id).load(path, {
        data: data, 
        headers: {
            "X-CSRF-Token": <?= json_encode($this->request->param('_csrfToken')); ?>
        }
    });
}

在这个函数中，我从另一个可以包含数据元素的文件中加载预设的 HTML 元素，这就是它首先从控制器请求数据的原因。我使用与第一个函数中相同的标头，并且 CSRF 令牌存在于控制台中。但它不起作用并引发不匹配错误。我想知道为什么会出现此错误以及如何解决它，例如，我是否必须刷新它以及如何？

请注意，我使用的是 3.6 更新之前的 CakePHP 3 版本，该版本删除了 CSRF 组件并添加了 CRSF 中间件。

提前致谢。

Answer 1

jQuery.load() 函数不接受 AJAX 配置参数，第二个参数要么是回调，要么是定义要与请求一起提交的 POST 数据的对象。

您要么必须切换到使用可配置的 AJAX 请求（例如在您的第一个 sn-p 中），要么全局配置 jQuery 以设置所有 AJAX 请求所需的标头：

$.ajaxSetup({
    headers: {
        'X-CSRF-Token': <?= json_encode($this->request->param('_csrfToken')); ?>
    }
});

另见

• https://api.jquery.com/load/
• https://api.jquery.com/jQuery.ajaxSetup/