Rozwiązanie konfliktu wtyczek zabezpieczających Netgsm i Wordfence

W tym artykule omówimy rozwiązywanie konfliktów wtyczek Netgsm i Wordfence Security. Ten konflikt występuje, gdy funkcja weryfikacji numeru telefonu wtyczki Netgsm za pomocą wiadomości SMS zostanie dodana do formularza rejestracyjnego Woocommerce i jednocześnie aktywowana jest wtyczka Wordfence Security. Jaka jest zatem przyczyna tego konfliktu? Przeanalizujmy go i rozwiążmy razem.

Wtyczka Wordfence Ukryte wejście i Netgsm

Wtyczka Wordfence dodaje ukryte dane wejściowe z identyfikatorem „wfls-email-verification” do formularza rejestracji i logowania Woocommerce w celu zapewnienia funkcjonalności funkcji recaptcha w sekcji bezpieczeństwa logowania. Kiedy klikniemy na przycisk „wyślij kod weryfikacyjny”, aby otrzymać wiadomość SMS po wypełnieniu formularza rejestracyjnego, w przeglądarce pojawia się ostrzeżenie uruchamiane przez wtyczkę Netgsm. W tym ostrzeżeniu jest napisane, że adres e-mail nie został wprowadzony, ale wprowadziliśmy adres e-mail. Powodem tego jest to, że wtyczka Netgsm nie może pobrać danych ze skrzynki e-mail, gdy Wordfence Security dodał ukryty element wejściowy. Dlatego zwraca ostrzeżenie, że adres e-mail nie został wprowadzony.

Spróbujmy użyć filtra Wordfence z PHP

Domyślnie dodawany jest ukryty element wejściowy Wordfence, nawet jeśli nie wpiszemy klucza recaptcha w ustawieniach zabezpieczeń logowania. Pierwszą rzeczą, która przychodzi nam na myśl, aby to usunąć, jest wyłączenie tej funkcji za pomocą filtrów Wordfence, prawda? Spróbujmy.

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

Chociaż ten kod usuwa wymóg captcha dla bezpieczeństwa logowania (ls: bezpieczeństwo logowania) w bieżącej wersji, nie usuwa ukrytych danych wejściowych. W tym przypadku idealnym rozwiązaniem byłoby usunięcie danych wejściowych z DOM za pomocą JavaScript. W tym artykule porozmawiamy o rozwiązaniu JavaScript. Oczywiście nie jest to jedyne rozwiązanie. Możemy znaleźć klasę i metodę OOP, do której wtyczka Wordfence dodaje odpowiednie dane wejściowe i nadpisuje je kodami, które zapisujemy w motywie potomnym lub wtyczce fragmentu kodu.

Usuńmy ukryte dane wejściowe z DOM za pomocą JavaScript

Możemy zastosować następujące podejście, aby usunąć ukryte dane wejściowe z kodów za pomocą JavaScript. Zanim wyjaśnimy szczegóły podejścia, omówmy ważną kwestię. Jeśli w tym podejściu zostanie użyte zdarzenie DOMContentLoaded, w niektórych witrynach kody mogą zostać zwrócone w postaci niezdefiniowanej. Zdarzenie DOMContentLoaded nie jest uruchamiane w żadnych okolicznościach po załadowaniu modelu DOM. Aby zapewnić sobie sukces, napisaliśmy nasze kody w zdarzeniu window.onload. Zalecamy dodanie tych kodów do znaczników skryptu, tuż przed zamykającym znacznikiem treści w 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());
});

Co więc zrobiliśmy z tymi kodami? Po załadowaniu modelu DOM na stronie wtyczka Wordfence Security dodaje zmienną o nazwie oowcRemoveWflsHiddenInput. Jeżeli elementu nie ma w DOM (np. jeśli ten kod uruchomił się na innej stronie, na której nie ma formularza), to nie sprawdzaliśmy istnienia elementu docelowego blokiem if, bo forEach i tak nie zadziała. Usunęliśmy wszystkie elementy docelowe znalezione w pętli forEach. Aby zapewnić zgodność kodów ze standardami ES12, stosuje się metodę rozprzestrzeniania. NodeList'iPrzekonwertowaliśmy go bezpośrednio na tablicę. W ten sposób NodeListBezpośrednio użyliśmy forEach, która jest metodą Array.