WPForms: как автоматически отключать форму после отправки, чтобы избежать повторных отправок

Диагностика проблемы повторных отправок формы в WPForms

Одной из частых проблем на сайтах с формами является повторная отправка данных пользователем. Это может привести к дублированию записей, ошибкам в обработке и ухудшению пользовательского опыта. В WPForms стандартная отправка формы не блокирует возможность повторной отправки, особенно если пользователь быстро обновляет страницу или нажимает кнопку отправки несколько раз.

Чтобы подтвердить наличие проблемы, проверьте следующие признаки:

• В базе данных или в списке записей WPForms появляются дубликаты с одинаковыми данными;
• Пользователи сообщают, что случайно отправляют форму несколько раз;
• В консоли браузера нет ошибок JavaScript, но форма не блокируется после отправки;
• Нет конфигурации, ограничивающей повторные отправки в настройках плагина.

Пошаговое решение: автоматическое отключение формы после отправки

1. Добавление JavaScript для блокировки кнопки отправки

Самый простой и эффективный способ предотвратить повторную отправку — заблокировать кнопку отправки сразу после первого нажатия. Для этого добавим кастомный скрипт, который подключится к событию формы WPForms.

function wpforms_disable_submit_button_script() {
    ?>
    <script>
    document.addEventListener('DOMContentLoaded', function() {
        const forms = document.querySelectorAll('.wpforms-form');
        forms.forEach(function(form) {
            form.addEventListener('submit', function(e) {
                const submitBtn = form.querySelector('button[type="submit"]');
                if (submitBtn) {
                    submitBtn.disabled = true;
                    submitBtn.style.opacity = '0.5';
                    submitBtn.textContent = 'Отправка...';
                }
            });
        });
    });
    </script>
    <?php
}
add_action('wp_footer', 'wpforms_disable_submit_button_script');

Добавьте этот код в файл functions.php вашей темы или в отдельный плагин для кастомных функций. Он отключит кнопку после первого нажатия и изменит ее текст, чтобы пользователь видел, что форма отправляется.

2. Серверная проверка для дополнительной защиты

Клиентская блокировка не всегда надежна — пользователь может отключить JavaScript. Чтобы гарантировать уникальность отправки, используйте проверку на сервере. Например, сохраняйте уникальный идентификатор в сессии или куках и сравнивайте его при повторных отправках. Ниже пример простой реализации с использованием сессий:

function wpforms_prevent_duplicate_submission( $fields, $entry, $form_data ) {
    if ( session_status() === PHP_SESSION_NONE ) {
        session_start();
    }

    $form_id = $form_data['id'];
    $unique_key = 'wpforms_submitted_' . $form_id;

    if ( isset($_SESSION[$unique_key]) && $_SESSION[$unique_key] === true ) {
        wp_die('Вы уже отправили эту форму. Повторная отправка запрещена.');
    } else {
        $_SESSION[$unique_key] = true;
    }
}
add_action( 'wpforms_process_complete', 'wpforms_prevent_duplicate_submission', 10, 3 );

Этот код блокирует повторную отправку формы в рамках одной сессии пользователя. Убедитесь, что сессии включены на сервере.

Проверка результата после внедрения

• Отправьте форму один раз — кнопка должна заблокироваться (серым и недоступным).
• Попробуйте обновить страницу и отправить форму повторно — при серверной проверке должно появиться сообщение об ошибке.
• Проверьте в административной панели наличие только одной записи с вашими данными.
• Проверьте работу на разных браузерах и устройствах.

Частые ошибки и как их исправить

• Кнопка не блокируется после отправки: Возможно, конфликт JavaScript или форма не имеет класса wpforms-form. Проверьте корректность селектора и отсутствие JS ошибок в консоли.
• Сообщение о повторной отправке появляется всегда: Убедитесь, что сессия инициализируется только один раз. Проверьте, не стирается ли сессия при переходах.
• Пользователь не видит изменения текста кнопки: Возможно, тема или плагин переопределяет стили или JS. Попробуйте увеличить приоритет хука или подключить скрипт внизу страницы.
• Некорректная работа с кэшированием: Если на сайте используется кэш, отключите кэширование страниц с формами или настройте исключения.

Практические советы по безопасности и производительности

• Всегда сочетайте клиентскую и серверную проверку для надёжной защиты от повторных отправок.
• При использовании сессий убедитесь, что они не конфликтуют с другими плагинами.
• Оптимизируйте JavaScript, не перегружайте страницу лишними скриптами.
• Если используете кеширование (например, WP Rocket, LiteSpeed Cache), исключайте страницы с формами из кеша или используйте AJAX-отправку без перезагрузки.

Сравнение методов блокировки повторных отправок