README

简介

此包是从该遗产仓库https://github.com/fabianwennink/IconCaptcha-Plugin-jQuery-PHP派生的，已转换为 Symfony Bundle。

如何使用

1. 安装

a. 安装 ext-gd php 扩展

 sudo apt install php8.1-gd
 
 Think to enable gd extension on your php.ini file

b. 安装供应商

 composer require tbaronnat/icon-recaptcha-bundle

在 composer.json 中，将包添加到自动加载部分

    "autoload": {
        "psr-4": {
            "App\\": "src/",
            "TBaronnat\\IconRecaptchaBundle\\": "vendor/tbaronnat/icon-recaptcha-bundle/src/"
        }
    },

在您的 route.yaml 文件中，导入路由资源

recaptcha:
  resource: '@TBaronnatIconRecaptchaBundle/Resources/config/routing.yaml'

2. 在您自己的 tbaronnat_icon_recaptcha.yaml 文件中配置选项

要了解所有选项的 php 或 javascript 使用方法，请阅读此文档：https://github.com/fabianwennink/IconCaptcha-Plugin-jQuery-PHP/wiki/How-To-Use#options

3. 需要覆盖文件 vendor/tbaronnat/icon-recaptcha-bundle/src/Resources/views/theme/js_and_css.html.twig 以包含 JavaScript 和 CSS 文件。

例如，如果您正在使用 webpack-encore-bundle，则可以这样做

webpack.config.js:
    Encore
        .copyFiles({
            from: './vendor/tbaronnat/icon-recaptcha-bundle/assets/css/',
            to: 'vendor/icon-recaptcha/[name].[ext]'
        })
        .copyFiles({
            from: './vendor/tbaronnat/icon-recaptcha-bundle/assets/js/',
            to: 'vendor/icon-recaptcha/[name].[ext]'
        })

然后，在以下位置创建目录

%kernel.project_dir%/templates/bundles/TBaronnatIconRecaptchaBundle/theme/

创建文件 js_and_css.html.twig 并包含以下内容

    (Ideally, defer css and js)
    <script src="{{ asset('/build/vendor/icon-recaptcha/icon-captcha.min.js') }}" async defer></script>
    <link rel="preload"
          href="{{ asset('/build/vendor/icon-recaptcha/icon-captcha.min.css')}}"
          as="style"
          onload="this.onload=null;this.rel='stylesheet';"
    >

您还可以通过覆盖 `config.html.twig 或 init.html.twig` 来更改 recaptcha 渲染的默认配置

4. 在您的表单类型中添加 IconRecaptchaType

$builder->add('recaptcha', IconReCaptchaType::class);

5. 当出现错误时重置 recaptcha

// If you want to reset the recaptcha du to any error during form submit, do this:

IconCaptcha.reset();