Egyéni captcha szolgáltatás integrálása űrlapokkal Customer Insights - Journeys

Customer Insights - Journeys Az űrlapok lehetővé teszik az egyéni CAPTCHA botvédelem használatát az űrlapbeküldések érvényesítéséhez. Ez a cikk példát mutat be a Google reCAPTCHA integrálására. A folyamat hasonló más captcha-szolgáltatásokhoz.

Feljegyzés

Az alkalmazás jelenlegi verziójában csak egy captcha-implementáció lehet aktív. Ha saját captcha-szolgáltatót használ (az alábbiakban leírtak szerint), a beépített captcha-t használó meglévő űrlapok nem fognak működni. Az egyéni captcha-implementációhoz legalább alapvető ismeretekre van szükség a dataverse beépülő modulok írásához és hibakereséséhez.

A folyamat a következő lépésekből áll:

1. Adja hozzá a reCAPTCHA-t az űrlaphoz.
2. Adja hozzá a captcha szöveges értéket az űrlap elküldéséhez az űrlap elküldése után.
3. Hozzon létre egy beépülő modult a CRM-ben, amely érvényesíti a captchát.

Lépésről lépésre: A Google reCAPTCHA integrálása

1. Adja hozzá a reCAPTCHA-t az űrlaphoz

1. Hozzon létre egy űrlapot a Customer Insights - Journeys űrlapszerkesztő.

2. Adjon hozzá egy attribútumot data-validate-submission="true" a <form> elemhez, amely lehetővé teszi az egyéni érvényesítést az űrlap beküldésén:

   

3. Adja hozzá az a értéket <div id="g-recaptcha"> az űrlaphoz a reCAPTCHA helyőrzőjeként. Ezt a div azonosítót később referenciaként használjuk. Javasoljuk, hogy a helyőrzőt az utolsó mező és a küldés gomb közé helyezze.

   

4. Tegye közzé az űrlapot, és ágyazza be a webhelyére.

5. Szerkessze azt az oldalt, amelybe az űrlapot beágyazta. Adja hozzá a Google által biztosított szkriptet az oldal fejlécéhez. Ez a szkript betölti a reCAPTCHA-t a onLoad visszahívási paraméterrel. Ezt a visszahívást a rendszer a captcha betöltésekor hívja meg.

   <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback" async defer></script>
   

6. Adja hozzá az onLoadCallback függvényt:

   function onloadCallback() {
       grecaptcha.render('g-recaptcha',
       { 
         sitekey: '{sitekey}',
       });
   }
   

   Cserélje le a {sitekey} helyőrzőt a Google által biztosított helyőrzőre. Ez a visszahívási függvény a reCAPTCHA-t a korábban létrehozott helyőrzőn <div id="g-recaptcha"> belül jeleníti meg.

7. Regisztrálja az onloadCallback függvényt, amelyet az űrlapbetöltő hív meg:

document.addEventListener("d365mkt-afterformload", onloadCallback);

2. Adja hozzá a captcha szöveges értéket az űrlap benyújtásához

Az űrlap elküldése után a g-recaptcha-response paraméter automatikusan hozzáadódik az űrlap elküldéséhez. A következő lépésekben egy beépülő modult fog létrehozni, amely elrejti ezt az értéket, mivel a rendszer hozzáadja a ValidationOnlyFields beépülő modul kódja által visszaadott válaszobjektum listájához.

3. Hozzon létre egy bővítményt

3.1 Hozzon létre egy Visual Studio projektet a bővítményhez

1. Nyisson meg Visual Studio és hozzon létre egy új osztálytárprojektet a .NET-keretrendszer 4.6.2-es verziójával.
2. A Megoldáskezelő válassza a Csomagok kezelése NuGet és telepítése lehetőséget Microsoft.CrmSdk.CoreAssemblies.

3.2 A plugin osztály létrehozása

1. Nevezze át Class1.cs erre: CustomValidationPlugin.cs.

2. Örökítse meg a CustomValidationPlugin osztályt az IPlugin felületről, és adja hozzá az Execute metódust.

   public class CustomValidationPlugin : IPlugin
   {
      public void Execute(IServiceProvider serviceProvider)
      {
   
      }
   }
   

3. Adja hozzá a következő kódot a végrehajtási metódushoz a környezet és a nyomkövetési szolgáltatás lekéréséhez.

   public void Execute(IServiceProvider serviceProvider)
   {
      // get tracing service
      ITracingService tracingService =
      (ITracingService)serviceProvider.GetService(typeof(ITracingService));
   
      // get plugin execution context
      IPluginExecutionContext context = (IPluginExecutionContext)
      serviceProvider.GetService(typeof(IPluginExecutionContext));
   }
   

4. Adja hozzá ezt a kódot az űrlapküldési paraméter karakterláncának lekéréséhez. Ez egy JSON-kódolású sztring, amely a felhasználó által az űrlapon elküldött mezőket jelöli. Ez a folyamat lekéri ezt a sztringet, és deszerializálja egy később definiált Deserialize segítő metódussal és FormSubmissionRequest osztállyal. Ez ellenőrzi, hogy a Fields tömb tartalmaz-e kulcsot a g-recaptcha-response-hoz. Ha a reCAPTCHA kulcs nem található, az érvényesítés kihagyását adja vissza, mivel a feldolgozandó űrlap nem tartalmazott Google recaptcha elemet.

   var requestString = (string)context.InputParameters["msdynmkt_formsubmissionrequest"];
   var requestObject = Deserialize<FormSubmissionRequest>(requestString);
   if (!requestObject.Fields.TryGetValue("g-recaptcha-response", out string recaptchaToken))
   {
      tracingService.Trace("g-recaptcha-response was not present in form submission");
      return;
   }
   

5. Adja hozzá a következő kódot, amely g-recaptcha-token null vagy üres.

   if (String.IsNullOrEmpty(recaptchaToken))
   {
      tracingService.Trace($"g-recaptcha-response value not found");
      return;
   }
   

6. Adja hozzá a következő kódot a Google captcha-jogkivonat Google API-kkal való ellenőrzéséhez.

   string url = "https://www.google.com/recaptcha/api/siteverify";
   using (HttpClient client = new HttpClient())
   {
      var content = new FormUrlEncodedContent(new Dictionary<string, string>
      {
         {"secret", "your_secret_key"},
         {"response", recaptchaToken}
      });
   
      try
      {
         var response = client.PostAsync(url, content).Result;
         if (!response.IsSuccessStatusCode)
         {
            tracingService.Trace($"Request Failed: ({response.StatusCode}){response.Content}");
            return;
         }
   
         var responseString = response.Content.ReadAsStringAsync().Result;
   
         gRecaptchaResponse = Deserialize<GRecaptchaResponse>(responseString);
   
         var resp = new ValidateFormSubmissionResponse()
         {
            IsValid = isValid,
            ValidationOnlyFields = new List<string>() { "g-recaptcha-response" }
         };
         context.OutputParameters["msdynmkt_validationresponse"] = Serialize(resp);
       }
       catch (Exception e)
       {
          tracingService.Trace($"{e.Message}");
       }
   }
   

   Először definiálja az URL-címet, majd létrehozza a példányát HttpClient . Létrejön egy FormUrlEncodedContent objektum, amely tartalmazza az recaptchaToken előző lépésekben lekért adatokat és a Google által biztosított titkos kulcsot. Ezután elküld egy kérést POST , és ellenőrzi az állapotkódot, ha nem sikeres, akkor visszatér. Ha sikeres, deszerializálja a választ a Deserialize segítő metódussal, és GRecaptchaResponse ezt később definiáljuk. Ezután létrehoz egy új ValidateFormSubmissionResponse objektumot, szerializálja azt, és beállítja a kimeneti paraméter msdynmkt_validationresponse értékeként, amely az egyetlen Microsoft-szolgáltatás, amelyet a beküldés elfogadására vagy elutasítására használ. Ha hozzáadja a g-recaptcha-response karakterláncot a listához, elrejti ezt a ValidationOnlyFields mezőt az űrlap beküldése elől a felhasználói felületen.

7. Adja hozzá a következő kódot a szerializálási és deszerializálási segítő metódusok meghatározásához.

   private T Deserialize<T>(string jsonString)
   {
      serializer = new DataContractJsonSerializer(typeof(T));
      T result;
      using (MemoryStream stream = new MemoryStream(Encoding.UTF8.GetBytes(jsonString)))
      {
         result = (T)serializer.ReadObject(stream);
      }
      return result;
   }
   
   private string Serialize<T>(T obj)
   {
       string result;
       serializer = new DataContractJsonSerializer(typeof(T));
       using (MemoryStream memoryStream = new MemoryStream())
       {
          serializer.WriteObject(memoryStream, obj);
          result = Encoding.Default.GetString(memoryStream.ToArray());
       }
       return result;
   }
   

8. Adja hozzá a következő kódot a JSON-sztringobjektumok szerializálásához/deszerializálásához szükséges osztályok meghatározásához.

   public class FormSubmissionRequest
    {
        public Dictionary<string, string> Fields { get; set; }
    }
   
    public class GRecaptchaResponse
    {
        public bool success { get; set; }
    }
   
    public class ValidateFormSubmissionResponse
    {
        public bool IsValid { get; set; }
        public List<string> ValidationOnlyFields { get; set; }
    }
   

3.3 Írja alá és készítse el a bővítményt

1. Kattintson a jobb gombbal a projektre, és válassza a Tulajdonságok lehetőséget a Solution Explorer ( Megoldáskezelő ) ablakban.
2. Válassza az Aláírás lapot, és jelölje be a Szerelvény aláírása jelölőnégyzetet.
3. Kiválasztás <New...>.
4. Adjon meg egy kulcsfájlnevet, és törölje a jelet a Kulcsfájl védelme jelszóval jelölőnégyzetből .
5. Készítse el a projektet.
6. A plugin szerelvényt CustomValidationPlugin.dll itt találja \bin\Debug.

3.4 Regisztrálja a bővítményt

1. Nyitott PluginRegistration.exe.
2. Válassza az Új kapcsolat létrehozása lehetőséget .
3. Választ Office 365.
4. Válassza Bejelentkezés lehetőséget.
5. Válassza a Regisztráció , majd az Új szerelvény regisztrálása lehetőséget.

   

6. Válassza ki a (...) gombra az 1. lépésben, és válassza ki az előző lépésekben beépített DLL-fájlt.
7. Válassza a Kijelölt bővítmény regisztrálása lehetőséget.

3.4 Regisztrációs lépés

1. Válassza a CustomValidationPlugin lehetőséget a regisztrált szerelvények listájából.
2. Válassza az Új lépés regisztrálása lehetőséget.
3. Írja be msdynmkt_validateformsubmission az Üzenet szövege mezőbe.
4. Győződjön meg arról, hogy a Végrehajtási mód szinkronra van állítva.

   

5. Győződjön meg arról, hogy a Végrehajtási sorrend beállítása 10.
6. Győződjön meg arról, hogy az eseményfolyamat végrehajtási fázisa utóműveletként van beállítva.
7. Válassza az Új lépés regisztrálása lehetőséget.

Összegzés

Az attribútummal rendelkező data-validate-submission űrlap elküldésekor az egyéni beépülő modul lefut, és érvényesíti a reCAPTCHA-választ a Google-szolgáltatásokkal. Az egyéni beépülő modul az alapértelmezett Microsoft érvényesítési beépülő modul után fog futni. Ha nincsenek Microsoft captcha mezők az űrlapon, a Microsoft beépülő modul beáll IsValid:false , és a küldés sikertelen lesz, hacsak nem írja felül a következővel IsValid:true.