Använd reCAPTCHA i Adaptiv Forms using-reCAPTCHA-in-adaptive-forms

Adobe rekommenderar att du använder den moderna och utbyggbara datainhämtningen Core Componentsför att skapa nya adaptiva Formseller att lägga till adaptiva Forms på AEM Sites-sidor. De här komponenterna utgör ett betydande framsteg när det gäller att skapa adaptiva Forms-filer, vilket ger imponerande användarupplevelser. I den här artikeln beskrivs det äldre sättet att skapa Adaptiv Forms med baskomponenter.

Version
Artikellänk
AEM 6.5
Klicka här
AEM as a Cloud Service
Den här artikeln
Gäller för
Adaptiv form baserad på grundläggande komponenter.
Klicka här för anpassat formulär baserat på kärnkomponenter.

CAPTCHA (Completely Automated Public Turing test to tell Computers and Humans Apart) är ett program som ofta används vid onlinetransaktioner för att skilja mellan människor och automatiserade program eller organ. Det utgör en utmaning och utvärderar användarens svar för att avgöra om det är en människa eller en robot som interagerar med webbplatsen. Det förhindrar användaren att fortsätta om testet misslyckas och gör onlinetransaktionerna säkra genom att förhindra att skräppost eller skadliga syften publiceras.

AEM Forms as a Cloud Service stöder följande CAPTCHA-lösningar:

Konfigurera tjänsten reCAPTCHA från Google google-reCAPTCHA

Formulärförfattare kan använda tjänsten reCAPTCHA från Google för att implementera reCAPTCHA i Adaptiv Forms. Den erbjuder avancerade CAPTCHA-funktioner för att skydda er webbplats. Mer information om hur reCAPTCHA fungerar finns i Google reCAPTCHA. AEM Forms stöder reCAPTCHA v2 och reCAPTCHA Enterprise. Andra versioner stöds inte. Observera också att reCAPTCHA i Adaptive Forms inte stöds i offlineläge i appen AEM Forms. Beroende på dina behov kan du konfigurera tjänsten reCAPTCHA för att aktivera:

reCAPTCHA

Konfigurera reCAPTCHA Enterprise steps-to-implement-reCAPTCHA-enterprise-in-forms

  1. Skapa eller välj ett Google Cloud-projekt och aktivera reCAPTCHA Enterprise API.

  2. Hämta projekt-ID och skapa en API-nyckel och en webbplatsnyckel för webbplatser.

  3. Skapa konfigurationsbehållare för molntjänster.

    1. Gå till Tools > General > Configuration Browser.

    2. Välj en mapp eller skapa en mapp och aktivera mappen för molnkonfigurationer med följande steg:

      1. Markera mappen i Configuration Browser och välj Properties.
      2. Aktivera Cloud Configurations i dialogrutan Konfiguration.
      3. Välj Save & Close om du vill spara konfigurationen och stänga dialogrutan.
  4. Konfigurera molntjänsten för reCAPTCHA Enterprise.

    1. Gå till tools-1 > Cloud Services på författarinstansen av Experience Manager.
    2. Välj reCAPTCHA. Sidan Konfigurationer öppnas. Välj den konfigurationsbehållare som du skapade och välj Create.
    3. Välj version som reCAPTCHA Enterprise och ange namn, projekt-ID, platsnyckel och API-nyckel (hämtas i steg 2) för reCAPTCHA Enterprise-tjänsten.
    4. Välj nyckeltyp. Nyckeltypen ska vara densamma som den webbplatsnyckel som du konfigurerade i Google Cloud-projektet, till exempel Checkbox-webbplatsnyckel eller Score-baserad webbplatsnyckel.
    5. Ange ett tröskelvärde i intervallet 0 till 1. Poängvärden som är större än eller lika med tröskelvärdena identifierar mänsklig interaktion, vilket i annat fall omfattar båda interaktioner.
    6. Välj Create om du vill skapa molntjänstkonfigurationen.

När du har aktiverat tjänsten reCAPTCHA Enterprise kan den användas i anpassningsbara formulär. Se använda CAPTCHA i adaptiva formulär.

Konfigurera Google reCAPTCHA v2 steps-to-implement-reCAPTCHA-v2-in-forms

  1. Hämta reCAPTCHA API-nyckelpar från Google. Den innehåller en webbplatsnyckel och en hemlig nyckel.

  2. Skapa konfigurationsbehållare för molntjänster.

    1. Gå till Tools > General > Configuration Browser.

    2. Välj en mapp eller skapa en mapp och aktivera mappen för molnkonfigurationer med följande steg:

      1. Markera mappen i Configuration Browser och välj Properties.
      2. Aktivera Cloud Configurations i dialogrutan Konfiguration.
      3. Välj Save & Close om du vill spara konfigurationen och stänga dialogrutan.
  3. Konfigurera molntjänsten för reCAPTCHA v2.

    1. Gå till tools-1 > Cloud Service på AEM författarinstans.
    2. Välj reCAPTCHA. Sidan Konfigurationer öppnas. Välj den konfigurationsbehållare som du skapade och välj Create.
    3. Välj version som reCAPTCHA v2, ange namn, platsnyckel och hemlig nyckel för reCAPTCHA-tjänsten (hämtas i steg 1) och välj Create för att skapa molntjänstkonfigurationen.
    4. I dialogrutan Redigera komponent anger du platsen och de hemliga nycklarna som fås i steg 1. Välj Save Settings och välj sedan OK för att slutföra konfigurationen.

    När reCAPTCHA-tjänsten har konfigurerats är den tillgänglig för användning i adaptiva formulär. Mer information finns i Använda CAPTCHA i adaptiva formulär.

Använd Google reCAPTCHA i anpassningsbara formulär using-reCAPTCHA

Så här använder du Google reCAPTCHA i en adaptiv form:

  1. Öppna ett anpassat formulär i redigeringsläge.

    note note
    NOTE
    Kontrollera att den konfigurationsbehållare som valts när du skapar det adaptiva formuläret innehåller molntjänsten reCAPTCHA. Du kan också redigera adaptiva formuläregenskaper för att ändra konfigurationsbehållaren som är kopplad till formuläret.
  2. Dra Captcha -komponenten från komponentwebbläsaren till det adaptiva formuläret.

    note note
    NOTE
    • Det går inte att använda mer än en Captcha-komponent i ett adaptivt formulär. Du bör inte heller använda CAPTCHA i en panel som är markerad för lazy loading eller i ett fragment.
    • reCaptcha är tidskänsligt och upphör om cirka ett par minuter. Därför rekommenderar vi att du placerar Captcha-komponenten precis före Skicka-knappen i den anpassade formen.
  3. Markera den Captcha-komponent som du har lagt till och välj cmpr för att redigera dess egenskaper.

  4. Ange en titel för CAPTCHA-widgeten. Standardvärdet är Captcha. Välj Dölj titel om du inte vill att titeln ska visas.

  5. I listrutan Captcha-tjänst väljer du reCAPTCHA för att aktivera reCAPTCHA-tjänsten om du har konfigurerat den enligt beskrivningen i reCAPTCHA-tjänsten av Google.

  6. Välj en konfiguration i listrutan Inställningar för reCAPTCHA Enterprise eller reCAPTCHA v2

    1. Om du väljer versionen reCAPTCHA Enterprise kan nyckeltypen vara kryssruta eller poäng baserad, den baseras på ditt val när du konfigurerar webbplatsnyckel för webbplatser:
    note note
    NOTE
    • I molnkonfigurationen med nyckeltyp som kryssruta visas det anpassade felmeddelandet som ett infogat meddelande om captcha-valideringen misslyckas.
    • I molnkonfigurationen med nyckeltyp som poäng baserad visas det anpassade felmeddelandet som ett popup-meddelande om captcha-valideringen misslyckas.
    1. Du kan välja storlek som Normal och Compact.
    2. Du kan välja en Bind Reference. I Bind Reference är skickade data bundna, annars är de obundna data. Nedan finns XML-exempel på obundna data och bundna data (med bind referens som SSN) när ett formulär skickas.
    code language-xml
            <?xml version="1.0" encoding="UTF-8" standalone="no"?>
            <afData>
            <afUnboundData>
                <data>
                    <captcha16820607953761>
                        <captchaType>reCaptchaEnterprise</captchaType>
                        <captchaScore>0.9</captchaScore>
                    </captcha16820607953761>
                </data>
            </afUnboundData>
            <afBoundData>
                <Root
                    xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/"
                    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
                    <PersonalDetails>
                        <SSN>371237912</SSN>
                        <FirstName>Sarah </FirstName>
                        <LastName>Smith</LastName>
                    </PersonalDetails>
                    <OtherInfo>
                        <City>California</City>
                        <Address>54 Residency</Address>
                        <State>USA</State>
                        <Zip>123112</Zip>
                    </OtherInfo>
                </Root>
            </afBoundData>
            <afSubmissionInfo>
                <stateOverrides/>
                <signers/>
                <afPath>/content/dam/formsanddocuments/captcha-form</afPath>
                <afSubmissionTime>20230608034928</afSubmissionTime>
            </afSubmissionInfo>
            </afData>
    
    code language-xml
            <?xml version="1.0" encoding="UTF-8" standalone="no"?>
            <afData>
            <afUnboundData>
                <data/>
            </afUnboundData>
            <afBoundData>
                <Root
                    xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/"
                    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
                    <PersonalDetails>
                        <SSN>
                            <captchaType>reCaptchaEnterprise</captchaType>
                            <captchaScore>0.9</captchaScore>
                        </SSN>
                        <FirstName>Sarah</FirstName>
                        <LastName>Smith</LastName>
                    </PersonalDetails>
                    <OtherInfo>
                        <City>California</City>
                        <Address>54 Residency</Address>
                        <State>USA</State>
                        <Zip>123112</Zip>
                    </OtherInfo>
                </Root>
            </afBoundData>
            <afSubmissionInfo>
                <stateOverrides/>
                <signers/>
                <afPath>/content/dam/formsanddocuments/captcha-form</afPath>
                <afSubmissionTime>20230608035111</afSubmissionTime>
            </afSubmissionInfo>
            </afData>
    

    Om du väljer version reCAPTCHA v2:

    1. Du kan välja storleken som Normal eller Compact för widgeten reCAPTCHA.
    2. Du kan välja alternativet Invisible om du bara vill visa CAPTCHA-utmaningen om en misstänkt aktivitet inträffar.

    Tjänsten reCAPTCHA är aktiverad i det adaptiva formuläret. Du kan förhandsgranska formuläret och se hur CAPTCHA fungerar. Märket protected by reCAPTCHA, som visas nedan, visas i skyddade formulär.
    Google skyddat av reCAPTCHA-märke

  7. Spara egenskaperna.

NOTE
Välj inte Default i listrutan för Captcha-tjänster eftersom AEM CAPTCHA-tjänsten är föråldrad.

Visa eller dölj CAPTCHA-komponent baserat på regler show-hide-captcha

Du kan välja att visa eller dölja CAPTCHA-komponenten baserat på regler som du tillämpar på en komponent i ett adaptivt formulär. Markera komponenten, välj redigera regler och välj Create för att skapa en regel. Mer information om hur du skapar regler finns i Regelredigeraren.

CAPTCHA-komponenten måste till exempel bara visas i ett adaptivt formulär om fältet Valutavärde i formuläret har ett värde över 25000.

Markera fältet Currency Value i formuläret och skapa följande regler:

Visa eller dölj regler

NOTE
När du väljer en reCAPTCHA v2-konfiguration och storleken är inställd på Invisible, är alternativet för att visa/dölja fortfarande inaktiverat.

Validera CAPTCHA validate-captcha

Du kan validera CAPTCHA i ett adaptivt formulär antingen när du skickar formuläret eller baserar CAPTCHA-valideringen på användaråtgärder och villkor.

Validera CAPTCHA när formulär skickas validation-form-submission

Så här validerar du en CAPTCHA automatiskt när du skickar in ett adaptivt formulär:

  1. Markera CAPTCHA-komponenten och välj cmpr för att visa komponentegenskaperna.
  2. Välj Validate CAPTCHA at form submission i avsnittet Validate CAPTCHA.
  3. Välj Klar om du vill spara komponentegenskaperna.

Validera CAPTCHA på användaråtgärder och villkor validate-captcha-user-action

Så här validerar du en CAPTCHA baserat på villkor och användaråtgärder:

  1. Markera CAPTCHA-komponenten och välj cmpr för att visa komponentegenskaperna.
  2. Välj Validate CAPTCHA on a user action i avsnittet Validate CAPTCHA.
  3. Välj Klar om du vill spara komponentegenskaperna.

Experience Manager Forms tillhandahåller ValidateCAPTCHA API för att validera CAPTCHA med fördefinierade villkor. Du kan anropa API:t med en anpassad skickaåtgärd eller genom att definiera regler för komponenter i ett anpassat formulär.

Följande är ett exempel på ett ValidateCAPTCHA-API för att validera CAPTCHA med fördefinierade villkor:

if (slingRequest.getParameter("numericbox1614079614831").length() >= 5) {
     GuideCaptchaValidatorProvider apiProvider = sling.getService(GuideCaptchaValidatorProvider.class);
        String formPath = slingRequest.getResource().getPath();
        String captchaData = slingRequest.getParameter(GuideConstants.GUIDE_CAPTCHA_DATA);
        if (!apiProvider.validateCAPTCHA(formPath, captchaData).isCaptchaValid()){
            response.setStatus(400);
            return;
        }
    }

Exemplet visar att API:t ValidateCAPTCHA bara validerar CAPTCHA i formuläret om antalet siffror i den numeriska rutan som användaren anger när formuläret fylls i är större än 5.

Alternativ 1: Använd Experience Manager Forms ValidateCAPTCHA API för att validera CAPTCHA med en anpassad överföringsåtgärd

Utför följande steg för att använda API:t ValidateCAPTCHA för att validera CAPTCHA med en anpassad skickaåtgärd:

  1. Lägg till skriptet som innehåller ValidateCAPTCHA-API:t till en anpassad skickaåtgärd. Mer information om anpassade Skicka-åtgärder finns i Skapa en anpassad Skicka-åtgärd för anpassad Forms.
  2. Välj namnet på den anpassade skickaåtgärden i listrutan Submit Action i egenskaperna Submission för ett anpassat formulär.
  3. Välj Submit. CAPTCHA valideras baserat på villkoren som definieras i ValidateCAPTCHA API för den anpassade åtgärden Skicka.

Alternativ 2: Använd Experience Manager Forms ValidateCAPTCHA API för att validera CAPTCHA på en användaråtgärd innan formuläret skickas

Du kan också anropa ValidateCAPTCHA API genom att tillämpa regler på en komponent i ett adaptivt formulär.

Du kan till exempel lägga till en Validate CAPTCHA-knapp i ett adaptivt formulär och skapa en regel som anropar en tjänst genom att klicka på en knapp.

Följande bild visar hur du kan anropa en tjänst genom att klicka på en Validate CAPTCHA-knapp:

Validera CAPTCHA

Du kan anropa den anpassade servern som innehåller ValidateCAPTCHA API med regelredigeraren och aktivera eller inaktivera skicka-knappen för det anpassade formuläret baserat på valideringsresultatet.

På samma sätt kan du använda regelredigeraren för att inkludera en anpassad metod för att validera CAPTCHA i ett adaptivt formulär.

Redigera reCAPTCHA-tjänstdomän reCAPTCHA-service-domain

reCAPTCHA-tjänsten använder https://www.recaptcha.net/ som standarddomän. Du kan ändra inställningarna för att ange https://www.google.com/ eller ett anpassat domännamn för inläsning, återgivning och validering av tjänsten reCAPTCHA.

Ange egenskapen af.cloudservices.recaptcha.domain för konfigurationen Adaptive Form and Interactive Communication Web Channel Configuration för att ange https://www.google.com/ eller något annat anpassat domännamn. I följande JSON-fil visas ett exempel:

{
  "af.cloudservices.recaptcha.domain": "https://www.google.com/"
}

Generera OSGi-konfigurationer med AEM SDK och distribuera konfigurationen till din Cloud Service om du vill ange värden för en konfiguration.

Se även see-also

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab