Как загружать reCaptcha с помощью partytown?
Есть сайт на WordPress в нем добавлен плагин Contact Form 7 , в нем же включена интеграция с reCaptcha v3
Для оптимизации web-vitals в pagespeed попробовали загружать метрики ( Яндекс и Гугл ) с помощью partytown
Но возникли трудности с переносом рекапчи.
Если вешать type="text/partytown" сразу на запрос к api рекапчи, то ничего не работает
(SITE_KEY - указан намеренно, это не ошибка, специально для скриншота)
Если же вешать уже на сам скрипт подключения рекапчи, который возвращается из этого запроса к api
То рекапча загружается, а вот Contact Form 7 , которая подвязана на последовательную загрузку рекапчи, а только потом своих скриптов, перестает работать.
Причем каких то удобных хуков для изменения этой ситуации не нашел, или готовых решений.
Как в итоге можно переместить весь функционал CF7 + reCaptacha в partytown?
Дополнительные вопросы
а вообще не использовать говнокапчу - не варинат?
Для ВП есть масса нормальных плагинов для защиты от ботов, а не от людей.
Например https://wordpress.org/plugins/la-sentinelle-antispam/. Почитай какие методы он использует. Даже первый отбивает 99% ботов.
Представьте себе - никаких проблем.
Во первых "не знаю о проблемах" совсем не значит "нет проблем". Но большинство так думает, и их это устраивает, да. А вот ТС копнул глубже и его не устроило (хотя его проблема даже не самая критичная из всех).
Во вторых вне зависимости автор ты или комментатор - всё, что я тебе выше написал справедливо и актуально (единственное что - да, я не разобрался что не ты автор вопроса). Перечитай ещё раз, подумай, повышай грамотность.
Но ты серьёзно? Этот плагин увеличивает время загрузки? Сомневаюсь.. Без него мерял? И насколько? (измерения нужно проводить не по разу, надеюсь это ты знаешь)
И да, ты можешь поискать в репо и другие плагины использующие те же методы, что и показанный (в первую очередь honeypot).
А так же можно использовать плагины для условий и в самом CF7 сделать скрытые поля, которые бот будет заполнять, а люди не увидят. Такая защита отбивает до 99% ботов, но самые умные всё же могут просачиваться. Для них уже нужно использовать другие методы (nonce, таймауты и пр)
Мне не может казаться что проблем нет, потому что нет предпосылок думать обратное.
Продолжай жить в неведении, так спокойнее.
Предлагаемая вами технология возможно гораздо лучше рекпчи В.3. Но как вы сами понимаете в ней абсолютно нет надобности. Я обязательно ознакомлюсь в свободное время с вашими рекомендациями.
Рекапча служит не для защиты от ботов, а для сбора данных о юзерах гуглом. (те использующие рекапчу сливают гуглу данные о своих клиентах. Очень "разумно".)
Любая капча - зло, снижает конверсию. Рекапча же - наибольшее из зол, тк тормозит загрузку (см проблему ТСа), не всегда "невидима" (т.е. часть юзеров должны угадывать светофоры и прочие мотоциклы) и даже не всегда показывается (тем более в современных условиях, когда гуглосервисы частично забанены у некоторых провайдеров), что есть прямая потеря клиентов.
Рекапча пробивается на раз. Есть сервисы и даже аддоны к браузерам для обхода рекапчи.
Есть ещё минусы, но сказанного уже должно быть достаточно за глаза.
При всём при этом есть десятки простых и более надёжных способов, без напрягания юзеров, отбить ботов от форм.
Итого: рекапча - большое зло как для юзеров, так и для владельцев ресурсов, а также маркер непрофессионализма разработчика.
vahromeevilya-widestudio @vahromeevilya-widestudio Автор вопроса Данный плагин https://wordpress.org/plugins/la-sentinelle-antispam/ к сожалению не работал, если подключать jquery самостоятельно.
Поискал другие варианты и нашел это https://ru.wordpress.org/plugins/honeypot/#description
Он тоже требует в себе jquery, но в данном случае, можно подгружать свой и плагин будет работать штатно. Вот, что сделал, чтобы убрать jquery из head ( вызывал TBT в pagespeed )
function custom_deregister_scripts() { wp_deregister_script('jquery-core'); wp_deregister_script('jquery-migrate'); } add_action('wp_enqueue_scripts', 'custom_deregister_scripts', 100); function remove_jquery_dependency_from_wpa_script() { // Отменяем регистрацию исходного скрипта wp_dequeue_script('wpascript'); wp_deregister_script('wpascript'); // Регистрируем скрипт заново без зависимости от 'jquery' wp_register_script('wpascript', plugins_url('/honeypot/includes/js/wpa.js'), array(), $GLOBALS['wpa_version'], true); wp_enqueue_script('wpascript'); // Если вам нужно добавить inline скрипт, как в исходном коде wp_add_inline_script('wpascript', 'wpa_field_info = ' . json_encode(wpa_field_info())); } // Добавляем нашу функцию в хук wp_enqueue_scripts с приоритетом, который гарантирует, что она выполнится после регистрации скриптов плагином add_action('wp_enqueue_scripts', 'remove_jquery_dependency_from_wpa_script', 100); |
function custom_deregister_scripts() { wp_deregister_script('jquery-core'); wp_deregister_script('jquery-migrate'); } add_action('wp_enqueue_scripts', 'custom_deregister_scripts', 100); function remove_jquery_dependency_from_wpa_script() { // Отменяем регистрацию исходного скрипта wp_dequeue_script('wpascript'); wp_deregister_script('wpascript'); // Регистрируем скрипт заново без зависимости от 'jquery' wp_register_script('wpascript', plugins_url('/honeypot/includes/js/wpa.js'), array(), $GLOBALS['wpa_version'], true); wp_enqueue_script('wpascript'); // Если вам нужно добавить inline скрипт, как в исходном коде wp_add_inline_script('wpascript', 'wpa_field_info = ' . json_encode(wpa_field_info())); } // Добавляем нашу функцию в хук wp_enqueue_scripts с приоритетом, который гарантирует, что она выполнится после регистрации скриптов плагином add_action('wp_enqueue_scripts', 'remove_jquery_dependency_from_wpa_script', 100);
А дальше в footer перед wp_footer добавляем свой jQuery и все.
От reCaptcha пришлось отказаться, в целях поднятия pagespeed баллов
- Имей ввиду, что заменять штатный jQuery на "свой" - может быть чревато разными проблемами. Например частичной или полной неработоспособностью плагинов и тем.
- Refguser, Тема своя, jquery нигде не используется, он и не нужен был нигде на сайте. Лишь плагины антиспама его требуют. Поэтому и сделал специально для них свой jquery
Ответы на вопрос 0
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
reCAPTCHA v3 плохо подходит для переноса в Partytown. В отличие от обычной метрики, она участвует в логике формы: должна загрузить скрипт, получить токен, передать его в Contact Form 7 и успеть обновлять этот токен перед отправкой. Если отправить reCAPTCHA в web worker, часть вызовов может перестать работать из-за доступа к DOM, iframe, cookies и внутренним API Google.
Поэтому я бы не переносил reCAPTCHA в Partytown как обычный сторонний скрипт. Более безопасные варианты:
Для Contact Form 7 можно точечно отключить скрипты там, где форм нет:
add_action('wp_enqueue_scripts', function () { if (! is_page(['contacts', 'request-a-free-seo-analysis'])) { wp_dequeue_script('contact-form-7'); wp_dequeue_style('contact-form-7'); } }, 20);
С reCAPTCHA нужно быть аккуратнее: handle может отличаться в зависимости от версии и интеграции. Его лучше посмотреть в HTML или через Query Monitor.
Если всё-таки экспериментировать с Partytown, не начинайте с продакшена. Проверьте полный сценарий: страница загрузилась, токен reCAPTCHA появился, форма отправилась, Contact Form 7 не вернул ошибку spam, письмо ушло. Если хотя бы один пункт ломается, reCAPTCHA нужно вернуть в основной поток.
Практический вывод: для Web Vitals лучше оптимизировать место загрузки reCAPTCHA, а не пытаться насильно перенести её в Partytown. Выигрыш от переноса может быть меньше, чем риск получить неработающие формы.