javascript - 如何防止在 Yii2 中提交多个表单？

Question

为了处理表单，我使用了以下代码(仅用于测试):

$(document).on("beforeSubmit", "#test-form", function (event, messages) {
    $(this).find(':submit').attr('disabled', true);
    console.log('Test new form');
    return false;
});

但是，尽管我将提交按钮设置为非事件状态，但我们可以在控制台中看到，当我快速单击该按钮时，该表单至少提交了两次。作为临时修复，编写了以下代码:

$(document).on("beforeValidate", "form", function(event, messages, deferreds) {
    $(this).find(':submit').attr('disabled', true);
    console.log('BEFORE VALIDATE TEST');
}).on("afterValidate", "form", function(event, messages, errorAttributes) {
    console.log('AFTER VALIDATE TEST');
    if (errorAttributes.length > 0) {
        $(this).find(':submit').attr('disabled', false);
    }
});
$(document).on("beforeSubmit", "#test-form", function (event, messages) {
    console.log('Test new form');
    return false;
});

但不确定这是不是一个好的决定。如何解决这个问题？
提前致谢!

Answer 1

一种解决方案是使用 JavaScript 禁用该按钮。但由于浏览器问题或用户可能在他的浏览器中禁用了 JavaScript，这并不是一直有效。

另一种解决方案是每次在服务器端检查表单是否已使用保存在 session 中的 token 提交。

以下代码可以在https://github.com/yiisoft/yii2/issues/10498中找到:

型号

public function getHiddenFormTokenField() {
    $token = \Yii::$app->getSecurity()->generateRandomString();
    $token = str_replace('+', '.', base64_encode($token));

    \Yii::$app->session->set(\Yii::$app->params['form_token_param'], $token);;
    return Html::hiddenInput(\Yii::$app->params['form_token_param'], $token);
}

“当表单提交时， Controller 类中名为‘beforeAction’的函数将发送的 token 与 session 中的值进行比较。每次执行操作后都会清除 session 。如果值不同，则抛出异常。”

Controller

public function beforeAction($action) {
    $formTokenName = \Yii::$app->params['form_token_param'];

    if ($formTokenValue = \Yii::$app->request->post($formTokenName)) {
        $sessionTokenValue = \Yii::$app->session->get($formTokenName);

        if ($formTokenValue != $sessionTokenValue ) {
            throw new \yii\web\HttpException(400, 'The form token could not be verified.');
        }

        \Yii::$app->session->remove($formTokenName);
    }

    return parent::beforeAction($action);
}