Recaptcha initialization

ReCaptchaCustomer/Model/AjaxLogin/ErrorProcessor.php

@@ -0,0 +1,61 @@
+<?php
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+declare(strict_types=1);
+
+namespace Magento\ReCaptchaCustomer\Model\AjaxLogin;
+
+use Magento\Framework\App\Action\Action;
+use Magento\Framework\App\ActionFlag;
+use Magento\Framework\App\ResponseInterface;
+use Magento\Framework\Serialize\SerializerInterface;
+
+/**
+ * Process error during ajax login
+ *
+ * Set "no dispatch" flag and error message to Response
+ */
+class ErrorProcessor
+{
+    /**
+     * @var ActionFlag
+     */
+    private $actionFlag;
+
+    /**
+     * @var SerializerInterface
+     */
+    private $serializer;
+
+    /**
+     * @param ActionFlag $actionFlag
+     * @param SerializerInterface $serializer
+     */
+    public function __construct(
+        ActionFlag $actionFlag,
+        SerializerInterface $serializer
+    ) {
+        $this->actionFlag = $actionFlag;
+        $this->serializer = $serializer;
+    }
+
+    /**
+     * Set "no dispatch" flag and error message to Response
+     *
+     * @param ResponseInterface $response
+     * @param string $message
+     * @return void
+     */
+    public function processError(ResponseInterface $response, string $message): void
+    {
+        $this->actionFlag->set('', Action::FLAG_NO_DISPATCH, true);
+
+        $jsonPayload = $this->serializer->serialize([
+            'errors' => true,
+            'message' => $message,
+        ]);
+        $response->representJson($jsonPayload);
+    }
+}

ReCaptchaCustomer/Observer/AjaxLoginObserver.php

@@ -8,13 +8,11 @@
 namespace Magento\ReCaptchaCustomer\Observer;
 
 use Magento\Framework\App\Action\Action;
-use Magento\Framework\App\ActionFlag;
-use Magento\Framework\App\ResponseInterface;
 use Magento\Framework\Event\Observer;
 use Magento\Framework\Event\ObserverInterface;
 use Magento\Framework\Exception\InputException;
 use Magento\Framework\Exception\LocalizedException;
-use Magento\Framework\Serialize\SerializerInterface;
+use Magento\ReCaptchaCustomer\Model\AjaxLogin\ErrorProcessor;
 use Magento\ReCaptchaUi\Model\CaptchaResponseResolverInterface;
 use Magento\ReCaptchaUi\Model\IsCaptchaEnabledInterface;
 use Magento\ReCaptchaUi\Model\ValidationConfigResolverInterface;
@@ -41,16 +39,6 @@ class AjaxLoginObserver implements ObserverInterface
      */
     private $captchaValidator;
 
-    /**
-     * @var ActionFlag
-     */
-    private $actionFlag;
-
-    /**
-     * @var SerializerInterface
-     */
-    private $serializer;
-
     /**
      * @var IsCaptchaEnabledInterface
      */
@@ -61,31 +49,33 @@ class AjaxLoginObserver implements ObserverInterface
      */
     private $logger;
 
+    /**
+     * @var ErrorProcessor
+     */
+    private $errorProcessor;
+
     /**
      * @param CaptchaResponseResolverInterface $captchaResponseResolver
      * @param ValidationConfigResolverInterface $validationConfigResolver
      * @param ValidatorInterface $captchaValidator
-     * @param ActionFlag $actionFlag
-     * @param SerializerInterface $serializer
      * @param IsCaptchaEnabledInterface $isCaptchaEnabled
      * @param LoggerInterface $logger
+     * @param ErrorProcessor $errorProcessor
      */
     public function __construct(
         CaptchaResponseResolverInterface $captchaResponseResolver,
         ValidationConfigResolverInterface $validationConfigResolver,
         ValidatorInterface $captchaValidator,
-        ActionFlag $actionFlag,
-        SerializerInterface $serializer,
         IsCaptchaEnabledInterface $isCaptchaEnabled,
-        LoggerInterface $logger
+        LoggerInterface $logger,
+        ErrorProcessor $errorProcessor
     ) {
         $this->captchaResponseResolver = $captchaResponseResolver;
         $this->validationConfigResolver = $validationConfigResolver;
         $this->captchaValidator = $captchaValidator;
-        $this->actionFlag = $actionFlag;
-        $this->serializer = $serializer;
         $this->isCaptchaEnabled = $isCaptchaEnabled;
         $this->logger = $logger;
+        $this->errorProcessor = $errorProcessor;
     }
 
     /**
@@ -108,30 +98,20 @@ public function execute(Observer $observer): void
                 $reCaptchaResponse = $this->captchaResponseResolver->resolve($request);
             } catch (InputException $e) {
                 $this->logger->error($e);
-                $this->processError($response, $validationConfig->getValidationFailureMessage());
+                $this->errorProcessor->processError(
+                    $response,
+                    $validationConfig->getValidationFailureMessage()
+                );
                 return;
             }
 
             $validationResult = $this->captchaValidator->isValid($reCaptchaResponse, $validationConfig);
             if (false === $validationResult->isValid()) {
-                $this->processError($response, $validationConfig->getValidationFailureMessage());
+                $this->errorProcessor->processError(
+                    $response,
+                    $validationConfig->getValidationFailureMessage()
+                );
             }
         }
     }
-
-    /**
-     * @param ResponseInterface $response
-     * @param string $message
-     * @return void
-     */
-    private function processError(ResponseInterface $response, string $message): void
-    {
-        $this->actionFlag->set('', Action::FLAG_NO_DISPATCH, true);
-
-        $jsonPayload = $this->serializer->serialize([
-            'errors' => true,
-            'message' => $message,
-        ]);
-        $response->representJson($jsonPayload);
-    }
 }

ReCaptchaFrontendUi/view/frontend/web/js/reCaptcha.js

@@ -10,9 +10,10 @@ define(
         'uiComponent',
         'jquery',
         'ko',
-        'Magento_ReCaptchaFrontendUi/js/registry'
+        'Magento_ReCaptchaFrontendUi/js/registry',
+        'Magento_ReCaptchaFrontendUi/js/reCaptchaScriptLoader'
     ],
-    function (Component, $, ko, registry, undefined) {
+    function (Component, $, ko, registry, reCaptchaLoader, undefined) {
         'use strict';
 
         return Component.extend({
@@ -50,16 +51,7 @@ define(
                     $(window).trigger('recaptchaapiready');
                 }.bind(this);
 
-                element = document.createElement('script');
-                scriptTag = document.getElementsByTagName('script')[0];
-
-                element.async = true;
-                element.src = 'https://www.google.com/recaptcha/api.js' +
-                    '?onload=globalOnRecaptchaOnLoadCallback&render=explicit' +
-                    (this.settings.rendering.lang ? '&hl=' + this.settings.rendering.lang : '');
-
-                scriptTag.parentNode.insertBefore(element, scriptTag);
-
+                reCaptchaLoader.addReCaptchaScriptTag();
             },
 
             /**

ReCaptchaFrontendUi/view/frontend/web/js/reCaptchaScriptLoader.js

@@ -0,0 +1,33 @@
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+
+define([], function () {
+        'use strict';
+
+        var scriptTagAdded = false;
+
+        return {
+            /**
+             * Add script tag. Script tag should be added once
+             */
+            addReCaptchaScriptTag: function () {
+                var element,
+                    scriptTag;
+
+                if (!scriptTagAdded) {
+                    element = document.createElement('script');
+                    scriptTag = document.getElementsByTagName('script')[0];
+
+                    element.async = true;
+                    element.src = 'https://www.google.com/recaptcha/api.js' +
+                        '?onload=globalOnRecaptchaOnLoadCallback&render=explicit';
+
+                    scriptTag.parentNode.insertBefore(element, scriptTag);
+                    scriptTagAdded = true;
+                }
+            }
+        }
+    }
+);

ReCaptchaUser/view/adminhtml/templates/recaptcha.phtml

@@ -7,11 +7,11 @@
 $config = $block->getCaptchaUiConfig();
 $renderingOptions = $config['rendering'] ?? [];
 $isInvisible = !empty($config['invisible']);
-$languageCode = $config['rendering']['lang'] ?? null;
 ?>
 <div class="admin__field <?= /* @noEscape */ $isInvisible ? 'field-invisible-recaptcha' : 'field-recaptcha' ?>">
     <div id="admin-recaptcha"
-         class="admin-recaptcha-content<?= /* @noEscape */ !empty($renderingOptions['size']) ? ' size-' . $renderingOptions['size'] : '' ?>"></div>
+         class="admin-recaptcha-content<?=
+         /* @noEscape */ !empty($renderingOptions['size']) ? ' size-' . $renderingOptions['size'] : '' ?>"></div>
 </div>
 
 <script>
@@ -25,25 +25,24 @@ $languageCode = $config['rendering']['lang'] ?? null;
 
         element.async = true;
         element.src = 'https://www.google.com/recaptcha/api.js'
-            + '?onload=globalOnRecaptchaOnLoadCallback&render=explicit'
-            <?php if (null !== $languageCode): ?><?="+'&hl={$languageCode}'" ?><?php endif; ?>;
+            + '?onload=globalOnRecaptchaOnLoadCallback&render=explicit';
 
         window.globalOnRecaptchaOnLoadCallback = function () {
             let token = '';
 
             this.widgetId = grecaptcha.render('admin-recaptcha', {
-                <?php foreach($renderingOptions as $key => $value):?>
+                <?php foreach ($renderingOptions as $key => $value): ?>
                 '<?= $block->escapeJs($key) ?>': '<?= $block->escapeJs($value) ?>',
                 <?php endforeach; ?>
                 'callback': function (token) { // jscs:ignore jsDoc
-                    <?php if ($isInvisible) : ?>
+                    <?php if ($isInvisible): ?>
                     this.token = token;
                     $('#login-form').submit();
                     <?php endif; ?>
                 }.bind(this)
             });
 
-            <?php if ($isInvisible) : ?>
+            <?php if ($isInvisible): ?>
             $('#login-form').submit(function (event) {
                 if (!this.token) {
                     event.preventDefault(event);

ReCaptchaVersion2Checkbox/Model/Adminhtml/UiConfigProvider.php

@@ -34,23 +34,6 @@ public function __construct(
         $this->scopeConfig = $scopeConfig;
     }
 
-    /**
-     * @inheritdoc
-     */
-    public function get(): array
-    {
-        $config = [
-            'rendering' => [
-                'sitekey' => $this->getPublicKey(),
-                'size' => $this->getSize(),
-                'theme' => $this->getTheme(),
-                'lang' => $this->getLanguageCode(),
-            ],
-            'invisible' => false,
-        ];
-        return $config;
-    }
-
     /**
      * Get Google API Website Key
      *
@@ -96,4 +79,21 @@ private function getLanguageCode(): string
             self::XML_PATH_LANGUAGE_CODE
         );
     }
+
+    /**
+     * @inheritdoc
+     */
+    public function get(): array
+    {
+        $config = [
+            'rendering' => [
+                'sitekey' => $this->getPublicKey(),
+                'size' => $this->getSize(),
+                'theme' => $this->getTheme(),
+                'hl' => $this->getLanguageCode(),
+            ],
+            'invisible' => false,
+        ];
+        return $config;
+    }
 }

ReCaptchaVersion2Checkbox/Model/Adminhtml/ValidationConfigProvider.php

@@ -51,23 +51,6 @@ public function __construct(
         $this->validationConfigFactory = $validationConfigFactory;
     }
 
-    /**
-     * @inheritdoc
-     */
-    public function get(): ValidationConfigInterface
-    {
-        /** @var ValidationConfigInterface $validationConfig */
-        $validationConfig = $this->validationConfigFactory->create(
-            [
-                'privateKey' => $this->getPrivateKey(),
-                'remoteIp' => $this->remoteAddress->getRemoteAddress(),
-                'validationFailureMessage' => $this->getValidationFailureMessage(),
-                'extensionAttributes' => null,
-            ]
-        );
-        return $validationConfig;
-    }
-
     /**
      * Get Google API Secret Key
      *
@@ -89,4 +72,21 @@ private function getValidationFailureMessage(): string
             (string)$this->scopeConfig->getValue(self::XML_PATH_VALIDATION_FAILURE)
         );
     }
+
+    /**
+     * @inheritdoc
+     */
+    public function get(): ValidationConfigInterface
+    {
+        /** @var ValidationConfigInterface $validationConfig */
+        $validationConfig = $this->validationConfigFactory->create(
+            [
+                'privateKey' => $this->getPrivateKey(),
+                'remoteIp' => $this->remoteAddress->getRemoteAddress(),
+                'validationFailureMessage' => $this->getValidationFailureMessage(),
+                'extensionAttributes' => null,
+            ]
+        );
+        return $validationConfig;
+    }
 }