Saltar al contenido

Magento 2 – Cómo agregar captcha a un formulario personalizado

Te damos la bienvenida a nuestra página, en este lugar hallarás la resolución de lo que andabas buscando.

Solución:

Debe seguir algunos pasos para usar magento captcha en un módulo personalizado.

Paso 1:

Crear Vendor/Module/etc/config.xml



    
        
            
                
                    1
                
                
                    1
                
            
        
        
            
                
                    
                        
                    
                
            
        
    

Paso 2:

Ir a Admin -> Tiendas -> Configuración -> Cliente -> Configuración de cliente -> Captcha y configurar. Puede ver el valor de las nuevas formas Formulario personalizado

Paso 3:

Crear Vendor/Module/view/frontend/layout/yourroutid_index_index.xml



    
        Custom Form
    
    
        
            
                
                    
                        
                            custom_form
                        
                        
                            230
                        
                        
                            50
                        
                    
                
            
        
        
            
        
    

Paso 4:

Crear Vendor/Module/Block/CaptchaForm.php

namespace VendorModuleBlock;


class CaptchaForm extends MagentoFrameworkViewElementTemplate

    public function getFormAction()
    
        return $this->getUrl('yourroute/index/post', ['_secure' => true]);
    

Paso 5:

Crear Vendor/Moduel/view/frontend/templates/captchaform.phtml


getChildHtml('form.additional.info'); ?>

Ahora puede ver el captcha en su formulario. Ahora necesita validar su captcha usando observer. Entonces utilizo el evento de predispatch posterior al controlador para la validación.

Paso 6:

Crear Vendor/Module/etc/frontend/events.xml



    
        
    

Paso 7:

Crear Vendor/Module/Observer/CheckCustomFormObserver.php

namespace VendorModuleObserver;

use MagentoFrameworkEventObserverInterface;
use MagentoFrameworkAppRequestDataPersistorInterface;
use MagentoFrameworkAppObjectManager;
use MagentoCaptchaObserverCaptchaStringResolver;

class CheckCustomFormObserver implements ObserverInterface

    /**
     * @var MagentoCaptchaHelperData
     */
    protected $_helper;

    /**
     * @var MagentoFrameworkAppActionFlag
     */
    protected $_actionFlag;

    /**
     * @var MagentoFrameworkMessageManagerInterface
     */
    protected $messageManager;

    /**
     * @var MagentoFrameworkAppResponseRedirectInterface
     */
    protected $redirect;

    /**
     * @var CaptchaStringResolver
     */
    protected $captchaStringResolver;

    /**
     * @var DataPersistorInterface
     */
    private $dataPersistor;

    /**
     * @param MagentoCaptchaHelperData $helper
     * @param MagentoFrameworkAppActionFlag $actionFlag
     * @param MagentoFrameworkMessageManagerInterface $messageManager
     * @param MagentoFrameworkAppResponseRedirectInterface $redirect
     * @param CaptchaStringResolver $captchaStringResolver
     */
    public function __construct(
        MagentoCaptchaHelperData $helper,
        MagentoFrameworkAppActionFlag $actionFlag,
        MagentoFrameworkMessageManagerInterface $messageManager,
        MagentoFrameworkAppResponseRedirectInterface $redirect,
        CaptchaStringResolver $captchaStringResolver
    ) 
        $this->_helper = $helper;
        $this->_actionFlag = $actionFlag;
        $this->messageManager = $messageManager;
        $this->redirect = $redirect;
        $this->captchaStringResolver = $captchaStringResolver;
    

    /**
     * Check CAPTCHA on Custom Form
     *
     * @param MagentoFrameworkEventObserver $observer
     * @return void
     */
    public function execute(MagentoFrameworkEventObserver $observer)
    
        $formId = 'custom_form';
        $captcha = $this->_helper->getCaptcha($formId);
        if ($captcha->isRequired()) 
            /** @var MagentoFrameworkAppActionAction $controller */
            $controller = $observer->getControllerAction();
            if (!$captcha->isCorrect($this->captchaStringResolver->resolve($controller->getRequest(), $formId))) 
                $this->messageManager->addError(__('Incorrect CAPTCHA.'));
                $this->getDataPersistor()->set($formId, $controller->getRequest()->getPostValue());
                $this->_actionFlag->set('', MagentoFrameworkAppActionAction::FLAG_NO_DISPATCH, true);
                $this->redirect->redirect($controller->getResponse(), 'yourroute/index/index');
            
        
    

    /**
     * Get Data Persistor
     *
     * @return DataPersistorInterface
     */
    private function getDataPersistor()
    
        if ($this->dataPersistor === null) 
            $this->dataPersistor = ObjectManager::getInstance()
                ->get(DataPersistorInterface::class);
        

        return $this->dataPersistor;
    

Implementando Google reCAPTCHA

Magento 2.3 requiere el módulo MSP_ReCaptcha que se puede utilizar para implementar reCAPTCHA en sus formularios personalizados. Para ello puedes ampliar el módulo con los siguientes pasos:

1. En primer lugar, agregue una opción de configuración al backend de administración:

app/code/Vendor/Module/etc/adminhtml/system.xml



    
        
MagentoConfigModelConfigSourceYesno 1

Nota: Aquí es necesario cambiar la identificación del campo.

2. Agregue una configuración predeterminada:

app/code/Vendor/Module/etc/config.xml



    
        
            
                1
            
        
    

Nota: Colocar a la identificación que estableció en el primer paso.

3. Debe configurar los tipos virtuales que utilizará el módulo:

app/code/Vendor/Module/etc/frontend/di.xml




    
    
        
            custom/index/index
        
    
    
        
            VendorModuleModelProviderFailureRedirectUrlCustomForm
        
    
    
        
            msp_securitysuite_recaptcha/frontend/enabled_custom
            frontend
        
    
    
        
            VendorModuleModelProviderIsCheckRequiredFrontendCustomForm
            VendorModuleModelProviderFailureCustomFormObserver
        
    

Nota: Tienes que cambiar custom/index/index a la ruta que desea que su usuario sea redirigido en caso de falla.

4. Defina un observador que se encargará de la validación:

app/code/Vendor/Module/etc/frontend/events.xml



    
        
    

Nota: Asegúrese de utilizar el observador definido en di.xml en el paso 3. ¡También debe establecer el nombre de evento correcto!

5. Agregue el bloque MSP_ReCaptcha a su bloque de formulario:

app/code/Vendor/Module/view/frontend/layout/custom_index_index.xml



    
        
            

                
                    
                        
                            
                                MSP_ReCaptcha/js/reCaptcha
                                custom_form
                            
                        
                    
                
            
        
    

6. El último paso es generar el bloque MSP_ReCaptcha dentro de su formulario:

app/code/Vendor/Module/view/frontend/templates/custom_form.phtml

getChildHtml('msp-recaptcha') ?>

Estos pasos se basan en un formulario en el área de la interfaz. También puede aplicar reCAPTCHA a sus formularios adminhtml. Para hacerlo, debe cambiar el área de di.xml, events.xml, layout.xml y template.phtml a adminhtml.

Para aquellos de ustedes que no pueden hacer que esto funcione, es posible que tengan que hacer lo que hice:

La razón por la que su captcha puede no mostrarse es porque la configuración básica es usar el bloque de captcha predeterminado que en _toHtml hace una verificación para ver si se requiere el captcha.

Si tiene la configuración para que el captcha siempre se muestre, probablemente no se encontró con este problema, sin embargo, si no está configurado para mostrar siempre los captchas y no desea mostrar siempre los captchas (es decir, crear una cuenta / iniciar sesión, etc.) de lo que necesita. establezca la lógica solo para su captcha personalizado en “Siempre se requerirá”.

en la línea 69 de proveedor / magento / module-captcha / Block / Captcha / DefaultCaptcha.php ya verás:

    /**
 * Renders captcha HTML (if required)
 *
 * @return string
 */
protected function _toHtml()


    if ($this->getCaptchaModel()->isRequired()) 
        $this->getCaptchaModel()->generate();
        return parent::_toHtml();
    
    return '';

$this->getCaptchaModel() llamadas $this->_captchaData->getCaptcha() Qué esta en
proveedor / magento / module-captcha / Helper / Data.php

    /**
 * Get Captcha
 *
 * @param string $formId
 * @return MagentoCaptchaModelCaptchaInterface
 */
public function getCaptcha($formId)

    if (!array_key_exists($formId, $this->_captcha)) 
        $captchaType = ucfirst($this->getConfig('type'));
        if (!$captchaType) 
            $captchaType = self::DEFAULT_CAPTCHA_TYPE;
         elseif ($captchaType == 'Default') 
            $captchaType = $captchaType . 'Model';
        

        $this->_captcha[$formId] = $this->_factory->create($captchaType, $formId);
    
    return $this->_captcha[$formId];

Aquí, el método getCaptcha verifica el valor de configuración del tipo de captcha a representar y carga su fábrica con $this->_factory->create()

Sin embargo, al entrar en esta clase de fábrica, verá

 public function create($captchaType, $formId)

    $className = 'MagentoCaptchaModel\' . ucfirst($captchaType);

    $instance = $this->_objectManager->create($className, ['formId' => $formId]);
    if (!$instance instanceof MagentoCaptchaModelCaptchaInterface) 
        throw new InvalidArgumentException(
            $className . ' does not implement MagentoCaptchaModelCaptchaInterface'
        );
    
    return $instance;

El problema aquí es que no importa lo que busque la fábrica en el módulo Magento Captcha para cualquier modelo de fábrica.

Necesitamos crear un complemento para envolver el ayudante y verificar nuestra clave de formulario y si se está utilizando nuestra clave de formulario, debemos crear una nueva clase de fábrica que cargue nuestro modelo que se extiende Magento Captcha Model DefaultModel y anula el método isRequired (). Algo que se parezca a esto:

en Su Módulo etc di.xml






    

en Su Módulo Complemento Ayudante CaptchaData

captchaFactory = $captchaFactory;


/**
 * @param MagentoCaptchaHelperData $subject
 * @param Closure $proceed
 * @param $formId
 * @return mixed
 */
public function aroundGetCaptcha(MagentoCaptchaHelperData $subject, Closure $proceed, $formId)

    if ($formId == 'your_form_key') 
        $this->_captcha[$formId] = $this->captchaFactory->create();
        return $this->_captcha[$formId];

    
    return $proceed($formId);


en Su Módulo Modelo CaptchaFactory

_objectManager = $objectManager;


/**
 * Get captcha instance
 *
 * @param string $captchaType
 * @param string $formId
 * @return MagentoCaptchaModelCaptchaInterface
 * @throws InvalidArgumentException
 */
public function create()

    $instance = $this->_objectManager->create('YourModuleModelCaptcha', ['formId' => 'event_subscriber']);
    if (!$instance instanceof MagentoCaptchaModelCaptchaInterface) 
        throw new InvalidArgumentException(
            'YourModuleModelCaptcha does not implement MagentoCaptchaModelCaptchaInterface'
        );
    
    return $instance;


y finalmente su modelo para anular el parámetro requerido en
Su Módulo Modelo Captcha:

Puntuaciones y reseñas

Si piensas que ha sido de ayuda nuestro artículo, nos gustaría que lo compartas con otros juniors de esta forma nos ayudas a dar difusión a nuestro contenido.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *