Ενοποίηση μιας προσαρμοσμένης υπηρεσίας captcha με φόρμες Customer Insights - Journeys

Άρθρο
01/17/2024

Οι φόρμες Customer Insights - Journeys σάς επιτρέπουν να χρησιμοποιείτε την προσαρμοσμένη προστασία captcha για να επικυρώνετε τις υποβολές φορμών. Σε αυτό το άρθρο δίνεται ένα παράδειγμα για τον τρόπο ενσωμάτωσης του Google reCAPTCHA. Η ροή είναι παρόμοια για άλλες υπηρεσίες captcha.

Σημείωμα

Στην τρέχουσα έκδοση της εφαρμογής, μόνο μία εφαρμογή captcha μπορεί να είναι ενεργή. Εάν χρησιμοποιήσετε τον δικό σας πάροχο captcha (όπως περιγράφεται παρακάτω), οι υπάρχουσες φόρμες που χρησιμοποιούν έτοιμο captcha θα σταματήσουν να λειτουργούν. Μια προσαρμοσμένη εφαρμογή captcha απαιτεί τουλάχιστον βασικές γνώσεις εγγραφής και εντοπισμού σφαλμάτων προσθηκών dataverse.

Η διεργασία αποτελείται από αυτά τα βήματα:

Προσθέστε reCAPTCHA στη φόρμα.
Προσθέστε την τιμή κειμένου captcha στην υποβολή φόρμας μόλις υποβληθεί η φόρμα.
Δημιουργήστε μια προσθήκη στο CRM που επικυρώνει το captcha.

Παράδειγμα βήμα προς βήμα: Ενοποίηση του Google reCAPTCHA

1. Προσθέστε reCAPTCHA στη φόρμα

Δημιουργήστε μια φόρμα στο πρόγραμμα φόρμας Customer Insights - Journeys.
Προσθέστε ένα data-validate-submission="true" χαρακτηριστικό στο στοιχείο <form> , το οποίο επιτρέπει προσαρμοσμένη επικύρωση στην υποβολή της φόρμας:
Προσθέστε ένα <div id="g-recaptcha"> στη φόρμα ως χαρακτήρα κράτησης θέσης για το reCAPTCHA. Αυτό το αναγνωριστικό div χρησιμοποιείται ως αναφορά αργότερα. Συνιστάται η τοποθέτηση του χαρακτήρα κράτησης θέσης μεταξύ του τελευταίου πεδίου και του κουμπιού υποβολής.
Δημοσιεύστε τη φόρμα και ενσωματώστε τη φόρμα στην τοποθεσία Web σας.
Επεξεργαστείτε τη σελίδα στην οποία ήταν ενσωματωμένη η φόρμα. Προσθέστε τη δέσμη ενεργειών που παρέχεται από την Google στην κεφαλίδα σελίδας. Αυτή η δέσμη ενεργειών φορτώνει το reCAPTCHA με την onLoadπαράμετρο επιστροφής κλήσης. Αυτή η επιστροφή κλήσης καλείται μόλις φορτωθεί το captcha.
```
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback" async defer></script>
```
Προσθέστε τη συνάρτηση onLoadCallback:
```
function onloadCallback() {
    grecaptcha.render('g-recaptcha',
    { 
      sitekey: '{sitekey}',
    });
}
```
Αντικαταστήστε τον χαρακτήρα κράτησης θέσης {sitekey} με αυτόν που παρέχεται από την Google. Αυτή η συνάρτηση επιστροφής κλήσης αποδίδει το reCAPTCHA μέσα στον χαρακτήρα κράτησης θέσης <div id="g-recaptcha"> που δημιουργήσατε νωρίτερα.
Καταχωρίστε τη συνάρτηση onloadCallback που θα κληθεί από το πρόγραμμα φόρτωσης φορμών:

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

2. Προσθέστε την τιμή κειμένου captcha στην υποβολή φόρμας

Μόλις υποβληθεί η φόρμα, η παράμετρος g-recaptcha-response προστίθεται αυτόματα στην υποβολή της φόρμας. Στα επόμενα βήματα, θα δημιουργήσετε μια προσθήκη που αποκρύπτει αυτήν την τιμή, καθώς θα προστεθεί στη λίστα ValidationOnlyFields στο αντικείμενο απόκρισης που επιστρέφεται από τον κωδικό προσθήκης.

Προστίθεται η παράμετρος G-recaptcha-response.

3. Δημιουργήστε μια προσθήκη

3.1 Δημιουργήσετε ένα έργο Visual Studio για την προσθήκη

Ανοίξτε το Visual Studio και δημιουργήστε ένα νέο έργο της Βιβλιοθήκης κλάσης χρησιμοποιώντας το .NET Framework 4.6.2.
Στην Εξερεύνηση λύσεων, επιλέξτε Διαχείριση πακέτων NuGet και εγκαταστήστε το Microsoft.CrmSdk.CoreAssemblies.

3.2 Δημιουργήστε την κλάση προσθήκης

Μετονομάστε το Class1.cs σε CustomValidationPlugin.cs.
Κάντε την κλάση CustomValidationPlugin να μεταβιβάζεται από το περιβάλλον εργασίας IPlugin και προσθέστε τη μέθοδο Execute.
```
public class CustomValidationPlugin : IPlugin
{
   public void Execute(IServiceProvider serviceProvider)
   {

   }
}
```

Προσθέστε τον παρακάτω κώδικα στη μέθοδο εκτέλεσης για ανάκτηση περιβάλλοντος και υπηρεσία ανίχνευσης.

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));
}

Προσθέστε αυτόν τον κωδικό για την ανάκτηση της συμβολοσειράς παραμέτρου υποβολής φόρμας. Είναι μια κωδικοποιημένη συμβολοσειρά JSON που αντιπροσωπεύει τα πεδία που υπέβαλε ο χρήστης στη φόρμα. Αυτή η διεργασία ανακτά αυτήν τη συμβολοσειρά και την αποσειριοποιεί χρησιμοποιώντας μια μέθοδο βοήθειας Αποσειριοποίηση και μια κλάση FormSubmissionRequest που καθορίζεται αργότερα. Με αυτόν τον τύπο ελέγχου, ο πίνακας Πεδία περιέχει ένα κλειδί για g-recaptcha-response. Σε περίπτωση που δεν βρεθεί το κλειδί reCAPTCHA, επιστρέφει την επικύρωση παράλειψης ως τη φόρμα που επεξεργάζεται, το οποίο δεν περιέχει στοιχείο recaptcha της Google.
```
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;
}
```
Προσθέστε τον ακόλουθο κωδικό για επιστροφή εάν η g-recaptcha-token τιμή είναι null ή κενή.
```
if (String.IsNullOrEmpty(recaptchaToken))
{
   tracingService.Trace($"g-recaptcha-response value not found");
   return;
}
```
Προσθέστε τον παρακάτω κώδικα για να επικυρώσετε το διακριτικό captcha της Google έναντι των API της Google.
```
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}");
    }
}
```
Αρχικά, ορίζεται η διεύθυνση URL και έπειτα δημιουργείται μια παρουσία HttpClient. Δημιουργείται ένα αντικείμενο FormUrlEncodedContent που περιέχει το recaptchaToken που ανακτήθηκε σε προηγούμενα βήματα και το μυστικό κλειδί που παρέχεται από την Google. Στη συνέχεια, ένα αίτημα POST αποστέλλεται και ο κωδικός κατάστασης ελέγχεται, εάν δεν είναι επιτυχής. Εάν είναι επιτυχής, αποσειριοποιεί την απόκριση χρησιμοποιώντας τη μέθοδο βοήθειας Αποσειριοποίηση και το GRecaptchaResponse που ορίζεται αργότερα. Στη συνέχεια, ένα νέο αντικείμενο ValidateFormSubmissionResponse το σειριοποιεί και το ορίζει ως τιμή της παραμέτρου εξόδου msdynmkt_validationresponse, η οποία είναι η υπηρεσία της Microsoft που χρησιμοποιεί για να αποδεχτεί ή να απορρίψει την υποβολή. Η προσθήκη της συμβολοσειράς g-recaptcha-response στη λίστα ValidationOnlyFields αποκρύπτει αυτό το πεδίο από την υποβολή της φόρμας στο περιβάλλον εργασίας χρήστη.

Προσθέστε τον παρακάτω κώδικα για να καθορίσετε μεθόδους βοήθειας για τη Σειριοποίηση και την Αποσειριοποίηση.

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;
}

Προσθέστε τον παρακάτω κώδικα για να καθορίσετε τις κλάσεις που απαιτούνται για τα αντικείμενα συμβολοσειρών Σειριοποίηση/Αποσειριοποίηση JSON.

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 Υπογράψτε και δημιουργήστε την προσθήκη

Κάντε δεξιό κλικ στο έργο και επιλέξτε Ιδιότητες στην Εξερεύνηση λύσεων.
Επιλέξτε την καρτέλα Υπογραφή και επιλέξτε το πλαίσιο ελέγχου Υπογραφή της συγκρότησης.
Επιλέξτε το στοιχείο <New...>.
Εισαγάγετε ένα όνομα αρχείου κλειδιού και καταργήστε την επιλογή Προστασία του αρχείου κλειδιού μου με έναν κωδικό πρόσβασης.
Δημιουργία του έργου.
Μπορείτε να βρείτε τη συγκρότηση της προσθήκης CustomValidationPlugin.dll στο \bin\Debug.

3.4 Καταχωρήστε προσθήκη

Άνοιγμα PluginRegistration.exe.
Επιλέξτε Δημιουργία νέας σύνδεσης.
Επιλέξτε Office 365.
Επιλέξτε Σύνδεση.
Επιλέξτε Καταχώρηση και έπειτα Καταχώριση νέας συγκρότησης.
Επιλέξτε το κουμπί (...) στο βήμα 1 και επιλέξτε το dll που είναι ενσωματωμένο στα προηγούμενα βήματα.
Επιλέξτε Καταχώριση επιλεγμένης προσθήκης.

3.4 Καταχωρήστε βήμα

Επιλέξτε CustomValidationPlugin από τη λίστα των καταχωρημένων συγκροτήσεων.
Επιλέξτε Καταχώριση επόμενου βήματος.
Πληκτρολογήστε msdynmkt_validateformsubmission στο πεδίο κειμένου μηνύματος.
Βεβαιωθείτε ότι η λειτουργία εκτέλεσης έχει οριστεί ως συγχρονισμένη.
Βεβαιωθείτε ότι η Εντολή εκτέλεσης έχει οριστεί σε 10.
Βεβαιωθείτε ότι το Στάδιο εκτέλεσης διοχέτευσης συμβάντος έχει οριστεί ως Δημοσίευση λειτουργίας.
Επιλέξτε Καταχώριση επόμενου βήματος.

Συμπέρασμα

Όταν υποβάλλεται μια φόρμα με το χαρακτηριστικό data-validate-submission, η προσαρμοσμένη προσθήκη εκτελείται και επικυρώνει την απόκριση reCAPTCHA με τις υπηρεσίες Google. Η προσαρμοσμένη προσθήκη θα εκτελεστεί μετά την προεπιλεγμένη προσθήκη επικύρωσης της Microsoft. Εάν δεν υπάρχουν πεδία captcha της Microsoft στη φόρμα, η προσθήκη της Microsoft ορίζει το IsValid:false και η υποβολή αποτυγχάνει, εκτός εάν την αντικαταστήσετε με IsValid:true.

Ροή επικύρωσης.

Κοινή χρήση μέσω