在本文中，我们将讨论 Netgsm 和 Wordfence Security 插件冲突解决方案。当 Netgsm 插件通过短信的电话号码验证功能添加到 Woocommerce 注册表单并且同时激活 Wordfence Security 插件时，就会发生此冲突。那么这场冲突的原因是什么呢？我们一起来分析和解决吧。

Wordfence 插件隐藏输入和 Netgsm

Wordfence 插件将带有“wfls-email-verification”ID 的隐藏输入添加到 Woocommerce 注册和登录表单中，以实现登录安全部分中的验证码功能。当我们填写注册表后点击“发送验证码”按钮接收短信时，我们在浏览器中遇到Netgsm插件触发的警告。在这个警告中，它说尚未输入电子邮件地址，但我们已经输入了电子邮件地址。原因是，当 Wordfence Security 添加了隐藏的输入元素时，Netgsm 插件无法从电子邮件箱检索数据。这就是为什么它会返回一条警告，提示未输入电子邮件地址。

让我们尝试在 PHP 中使用 Wordfence 过滤器

即使我们没有在登录安全设置中输入验证码，Wordfence 的隐藏输入元素也是默认添加的。要删除此功能，我们首先想到的是使用 Wordfence 过滤器禁用此功能，对吗？我们来试试吧。

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

虽然此代码在当前版本中删除了登录安全性的验证码要求（ls：登录安全性），但它并没有删除隐藏的输入。在这种情况下，理想的解决方案是使用 Javascript 从 DOM 中删除输入。在这篇文章中，我们将讨论 Javascript 解决方案。当然，这不是唯一的解决方案。我们可以找到Wordfence插件添加相关输入的OOP类和方法，并用我们在子主题或代码片段插件中编写的代码覆盖它。

让我们用 Javascript 删除 DOM 中的隐藏输入

我们可以使用以下方法从 Javascript 代码中删除隐藏输入。在解释该方法的细节之前，让我们先讨论一个重要问题。如果在此方法中使用 DOMContentLoaded 事件，代码可能会在某些站点上返回 undefined。在任何情况下加载 DOM 时，DOMContentLoaded 事件都不会运行。为了确保我们的成功，我们将代码编写在 window.onload 事件中。我们建议您将这些代码添加到 script 标签中，就在 DOM 中的结束 body 标签之前。

// 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方法。