Contact Form 7: как избавиться от повторной отправки формы при обновлении страницы

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

Если пользователь после успешной отправки формы Contact Form 7 обновляет страницу браузера, появляется предупреждение о повторной отправке данных. Это распространённая проблема, которая может привести к дублированию заявок и ухудшению пользовательского опыта.

Чтобы проверить, есть ли эта проблема на вашем сайте, выполните простую проверку:

• Заполните форму и отправьте её.
• После появления сообщения об успешной отправке нажмите F5 или используйте кнопку обновления в браузере.
• Если браузер выводит предупреждение о повторной отправке формы (Confirm Form Resubmission), значит проблема существует.

Почему возникает повторная отправка формы?

Причина в том, что Contact Form 7 по умолчанию отправляет форму методом POST, и после успешной отправки пользователь остаётся на той же странице. При обновлении страницы браузер пытается повторить POST-запрос, что вызывает предупреждение.

Для решения задачи требуется реализовать так называемый паттерн Post/Redirect/Get (PRG), при котором после обработки POST-запроса происходит перенаправление на страницу с GET-запросом.

Пошаговое решение: реализация PRG для Contact Form 7

1. Добавляем обработчик успешной отправки формы

Contact Form 7 имеет JavaScript-событие wpcf7mailsent, которое срабатывает после успешной отправки формы. Мы будем использовать это событие для перенаправления пользователя.

2. Добавляем перенаправление на текущую страницу с параметром GET

Вставьте следующий код в файл темы functions.php или в отдельный JavaScript-файл, подключённый к странице с формой:

document.addEventListener('wpcf7mailsent', function(event) {
    var currentUrl = window.location.href.split('#')[0].split('?')[0];
    // Добавляем параметр, чтобы избежать повторной отправки
    window.location.href = currentUrl + '?submitted=1';
}, false);

Этот код после успешной отправки формы перенаправит пользователя на тот же URL, но с параметром submitted=1, что изменит метод запроса на GET.

3. Добавляем условие в шаблон страницы для вывода сообщения

Чтобы не потерять уведомление об успешной отправке, выведите сообщение, если есть параметр submitted=1. Например, в PHP-шаблоне страницы:

if ( isset($_GET['submitted']) && $_GET['submitted'] == '1' ) {
    echo '<div class="wpcf7-success-message">Спасибо! Ваше сообщение отправлено.</div>';
}

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

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

• Отправьте форму Contact Form 7.
• Убедитесь, что после отправки происходит автоматическое перенаправление на URL с ?submitted=1.
• Обновите страницу — предупреждение о повторной отправке формы исчезнет.
• Сообщение об успешной отправке отображается корректно.

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

• Перенаправление не происходит: Проверьте, что ваш JavaScript-код загрузился и не конфликтует с другими скриптами. Используйте консоль браузера для отладки.
• Сообщение об успешной отправке не отображается: Убедитесь, что условие вывода сообщения в PHP-шаблоне правильно проверяет параметр submitted.
• Параметр ?submitted=1 ломает структуру URL или SEO: Можно использовать более сложные методы, например, с куками или локальным хранилищем, но для большинства случаев этот метод подходит.

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

• Не используйте редирект на сторонние URL без проверки, чтобы избежать уязвимостей открытого редиректа.
• Добавляйте параметр GET, который не влияет на индексирование страниц поисковиками (можно закрыть через robots.txt или мета-тег).
• Для больших сайтов с высокой нагрузкой используйте кеширование, но исключайте из кеша страницы с формами и параметром submitted.

Альтернативные подходы: сравнение методов реализации PRG для CF7