pelock/yii2-anti-spam-form

Anti-Spam Form 是 Yii2 框架的一个表单替换组件,用于创建对垃圾邮件机器人及抓取工具在 HTML 代码中不可见的反垃圾邮件表单。

1.0.0 2022-07-14 11:56 UTC

This package is auto-updated.

Last update: 2024-09-11 18:51:10 UTC


README

Anti-Spam Form 是一个用于创建在 HTML 代码中对垃圾邮件机器人及抓取工具不可见的反垃圾邮件表单的 Yii2 框架组件。

反垃圾邮件表单背后的想法是什么?

这个概念很简单。在大多数情况下,垃圾邮件机器人是简单的工具。它们会读取您的网站,寻找 <form> HTML 标签,并人为地填写表单字段并提交。

通常的垃圾邮件机器人是使用 Python 编写的网络爬虫,获取原始 HTML 页面内容 而不评估 JS 代码。

但在反垃圾邮件检测方法中遗漏了一点,那就是垃圾邮件机器人通常无法处理 JavaScript 代码。原因很简单。这需要消耗时间,并且需要 JS 解释器来评估网页中的 JS 代码。而且,在不使用复杂且通常基于 Chromium 等的更慢的执行引擎的情况下,很难将 JS 评估集成到其中。

如何打破垃圾邮件机器人?

很简单 - 在 JS 代码中包裹 HTML 表单。不是整个表单,而是带有所有属性的起始 <form> 标签。

突然之间,垃圾邮件机器人无法找到它。少些垃圾邮件,无需太多工作。

如何安装 Anti-Spam Form 组件?

首先安装它。通过 WebApi 接口安装的首选方式是使用 composer

运行

php composer.phar require --prefer-dist pelock/yii2-anti-spam-form "*"

或直接将此条目

"pelock/yii2-anti-spam-form": "*"

添加到您的 composer.json 文件的 require 部分。

安装包可在 https://packagist.org.cn/packages/pelock/yii2-anti-spam-form 获取

如何使用 Anti-Spam Form?

AntiSpamForm 替换您的常规 Yii2 ActiveForm 组件

<div class="active-form">
<?php $form = ActiveForm::begin(['id' => 'contact-form']); ?>
    <?= $form->field($model, 'name') ?>
    <?= $form->field($model, 'email')->textInput(['type' => 'email']) ?>
    <?= $form->field($model, 'subject') ?>
    <?= $form->field($model, 'body')->textArea(['rows' => 6]) ?>

    <?php //echo Html::submitButton('Send', ['class' => 'btn btn-block btn-primary', 'name' => 'contact-button']) ?>

    <?php echo $form->field($model, 'verifyCode')->widget(Captcha::className(), [ 'template' => '<div class="row"><div class="col-xs-4 col-sm-3 col-md-3">{image}</div><div class="col-xs-2 col-sm-3 col-md-3">{input}</div><div class="col-xs-6 col-sm-6 col-md-6">'. Html::submitButton('Send', ['class' => 'btn btn-block btn-primary', 'name' => 'contact-button']) .'</div></div>', ]) ?>
<?php ActiveForm::end(); ?>
</div>

// include AntiSpamForm
use pelock\antispamform\AntiSpamForm;

...

<div class="active-form">
<!--replace here -->
<?php $form = AntiSpamForm::begin(['id' => 'contact-form']); ?>
    <?= $form->field($model, 'name') ?>
    <?= $form->field($model, 'email')->textInput(['type' => 'email']) ?>
    <?= $form->field($model, 'subject') ?>
    <?= $form->field($model, 'body')->textArea(['rows' => 6]) ?>

    <?php //echo Html::submitButton('Send', ['class' => 'btn btn-block btn-primary', 'name' => 'contact-button']) ?>

    <?php echo $form->field($model, 'verifyCode')->widget(Captcha::className(), [ 'template' => '<div class="row"><div class="col-xs-4 col-sm-3 col-md-3">{image}</div><div class="col-xs-2 col-sm-3 col-md-3">{input}</div><div class="col-xs-6 col-sm-6 col-md-6">'. Html::submitButton('Send', ['class' => 'btn btn-block btn-primary', 'name' => 'contact-button']) .'</div></div>', ]) ?>
<!--and here -->    
<?php AntiSpamForm::end(); ?>
</div>

这就结束了!表单将按预期工作,唯一的区别是输出 HTML 代码。

生成的 HTML 代码

通常的 ActiveForm 输出 HTML 代码与 AntiSpamForm 代码有什么区别?

让我们看看。在此之前

<div class="active-form">
  <!--visible <form> tag -->  
  <form id="contact-form" action="/contact" method="post">
    <input type="hidden" name="_csrf" value="u18o4NxJC5lZEhHhjpMTd-c7p3ZzYzl0wvsXMiefJJ_0HWGpr1pm6x5Qa4vnpVw5o1yXNzEQ7USUlE9HVNlGzQ==">
    <div class="form-group field-contactform-name required">
      <label class="control-label" for="contactform-name">Name</label>
      <input type="text" id="contactform-name" class="form-control" name="ContactForm[name]" aria-required="true">
      <p class="help-block help-block-error"></p>
    </div>
    <div class="form-group field-contactform-email required">
      <label class="control-label" for="contactform-email">Email</label>
      <input type="email" id="contactform-email" class="form-control" name="ContactForm[email]" aria-required="true">
      <p class="help-block help-block-error"></p>
    </div>
    <div class="form-group field-contactform-subject required">
      <label class="control-label" for="contactform-subject">Subject</label>
      <input type="text" id="contactform-subject" class="form-control" name="ContactForm[subject]" aria-required="true">
      <p class="help-block help-block-error"></p>
    </div>
    <div class="form-group field-contactform-body required">
      <label class="control-label" for="contactform-body">Body</label>
      <textarea id="contactform-body" class="form-control" name="ContactForm[body]" rows="6" aria-required="true"></textarea>
      <p class="help-block help-block-error"></p>
    </div>
    <div class="form-group field-contactform-verifycode">
      <label class="control-label" for="contactform-verifycode">Verification Code</label>
      <div class="row">
        <div class="col-xs-4 col-sm-3 col-md-3">
          <img id="contactform-verifycode-image" src="/site/captcha?v=62cff29d6ebe55.89254929" alt="">
        </div>
        <div class="col-xs-2 col-sm-3 col-md-3">
          <input type="text" id="contactform-verifycode" class="form-control" name="ContactForm[verifyCode]">
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6">
          <button type="submit" class="btn btn-block btn-primary" name="contact-button">Send</button>
        </div>
      </div>
      <p class="help-block help-block-error"></p>
    </div>
  </form>
</div>

之后

<div class="active-form">
  <!-- <form> tag dynamically generated with the JavaScript code -->    
  <script>
    document.write(atob("PGZvcm0gaWQ9ImNvbnRhY3QtZm9ybSIgYWN0aW9uPSIvY29udGFjdCIgbWV0aG9kPSJwb3N0Ij4KPGlucHV0IHR5cGU9ImhpZGRlbiIgbmFtZT0iX2NzcmYiIHZhbHVlPSJ1MFczN0JLaDJOQko2Q2lVeTFxc3R3OEp6aC1mcUxxOXRnOEpQem9CUjZfMEJfNmxYX0sxb2c2cVV2NmliT1A1UzI3LVh0M2F6bzNnWUZGS1NVY2xfUT09Ij4="));
  </script>
  <div class="form-group field-contactform-name required">
    <label class="control-label" for="contactform-name">Name</label>
    <input type="text" id="contactform-name" class="form-control" name="ContactForm[name]" aria-required="true">
    <p class="help-block help-block-error"></p>
  </div>
  <div class="form-group field-contactform-email required">
    <label class="control-label" for="contactform-email">Email</label>
    <input type="email" id="contactform-email" class="form-control" name="ContactForm[email]" aria-required="true">
    <p class="help-block help-block-error"></p>
  </div>
  <div class="form-group field-contactform-subject required">
    <label class="control-label" for="contactform-subject">Subject</label>
    <input type="text" id="contactform-subject" class="form-control" name="ContactForm[subject]" aria-required="true">
    <p class="help-block help-block-error"></p>
  </div>
  <div class="form-group field-contactform-body required">
    <label class="control-label" for="contactform-body">Body</label>
    <textarea id="contactform-body" class="form-control" name="ContactForm[body]" rows="6" aria-required="true"></textarea>
    <p class="help-block help-block-error"></p>
  </div>
  <div class="form-group field-contactform-verifycode">
    <label class="control-label" for="contactform-verifycode">Verification Code</label>
    <div class="row">
      <div class="col-xs-4 col-sm-3 col-md-3">
        <img id="contactform-verifycode-image" src="/site/captcha?v=62cff214a00af2.73036299" alt="">
      </div>
      <div class="col-xs-2 col-sm-3 col-md-3">
        <input type="text" id="contactform-verifycode" class="form-control" name="ContactForm[verifyCode]">
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6">
        <button type="submit" class="btn btn-block btn-primary" name="contact-button">Send</button>
      </div>
    </div>
    <p class="help-block help-block-error"></p>
  </div>
  </form>
</div>

JavaScript 代码生成输出 <form> 元素及其所有属性。这是一种简单而有效的针对垃圾邮件机器人及网络爬虫、收集器等的解决方案。

我应该移除 CAPTCHA 验证吗?

不。你应该保留你的 CAPTCHA 验证,因为一些机器人能够运行 JS 代码,所以 Anti-Spam Form 将提供额外的反垃圾邮件保护层。

错误、问题、功能请求

希望您喜欢。如有问题、错误和功能请求,请访问我的网站

Bartosz Wójcik