Вирішення конфлікту плагінів безпеки Netgsm і Wordfence

У цій статті ми поговоримо про вирішення конфліктів плагінів Netgsm і Wordfence Security. Цей конфлікт виникає, коли функція перевірки телефонного номера плагіна Netgsm за допомогою SMS додається до реєстраційної форми Woocommerce і водночас активується плагін Wordfence Security. Тож у чому причина цього конфлікту? Давайте розглянемо і розв’яжемо її разом.

Плагін Wordfence Прихований вхід і Netgsm

Плагін Wordfence додає приховане введення з ідентифікатором «wfls-email-verification» до форми реєстрації та входу Woocommerce для функціональності функції recaptcha в розділі безпеки входу. Коли ми натискаємо кнопку «Надіслати код підтвердження», щоб отримати SMS після заповнення реєстраційної форми, ми стикаємося з попередженням у браузері, викликаним плагіном Netgsm. У цьому попередженні сказано, що адресу електронної пошти не введено, але ми ввели адресу електронної пошти. Причина цього полягає в тому, що плагін Netgsm не може отримати дані з електронної скриньки, поки існує прихований елемент введення, доданий Wordfence Security. Тому він повертає попередження про те, що адреса електронної пошти не була введена.

Давайте спробуємо використати Wordfence Filter із PHP

Прихований елемент введення Wordfence додається за замовчуванням, навіть якщо ми не вводимо ключ recaptcha в налаштуваннях безпеки входу. Перше, що спадає нам на думку, щоб видалити це, це вимкнути цю функцію за допомогою фільтрів Wordfence, чи не так? Давайте спробуємо.

<?php add_filter( 'wordfence_ls_require_captcha', '__return_false' );

Хоча цей код усуває вимогу captcha для безпеки входу (ls: login security) у поточній версії, він не видаляє прихований вхід. У цьому випадку ідеальним рішенням було б видалити вхідні дані з DOM за допомогою Javascript. У цій статті ми поговоримо про рішення Javascript. Звичайно, це не єдине рішення. Ми можемо знайти ООП-клас і метод, до якого плагін Wordfence додає відповідний вхід, і замінити його кодами, які ми пишемо в дочірній темі або плагіні фрагмента коду.

Давайте видалимо прихований вхід із DOM за допомогою Javascript

Ми можемо використати наступний підхід, щоб видалити прихований вхід із кодів за допомогою Javascript. Перш ніж пояснювати деталі підходу, давайте обговоримо важливе питання. Якщо в цьому підході використовується подія DOMContentLoaded, на деяких сайтах коди можуть повертати невизначені. Подія DOMContentLoaded не запускається, коли DOM завантажується за будь-яких обставин. Щоб забезпечити наш успіх, ми написали наші коди в події window.onload. Ми рекомендуємо додавати ці коди серед тегів сценарію безпосередньо перед закриваючим тегом body у DOM.

// Remove Wordfence Security hidden email input due to conflict with Netgsm plugin by Onur Özden Web Çözümleri
 window.addEventListener('load', () => {
    // used window.onload due to DOMContentLoaded not working properly for this codes
  const oowcRemoveWflsHiddenInput = [...document.querySelectorAll("input[name='wfls-email-verification']")];
  oowcRemoveWflsHiddenInput.forEach(hiddenInput => hiddenInput.remove());
});

Отже, що ми зробили з цими кодами? Коли DOM на сторінці завантажується, плагін безпеки Wordfence додає змінну під назвою oowcRemoveWflsHiddenInput. Якщо елемент відсутній у DOM (наприклад, якщо цей код запускався на іншій сторінці, де не існує форми), ми не перевіряли існування цільового елемента за допомогою блоку if, оскільки forEach все одно не працюватиме. Ми видалили всі цільові елементи, знайдені за допомогою циклу forEach. Для забезпечення відповідності кодів стандартам ES12 використовується метод поширення. NodeList'iМи перетворили його безпосередньо в масив. Таким чином NodeListМи безпосередньо використали forEach, який є методом Array.