לכוד טפסים ב-Customer Insights - Journeys

לכידת הטפסים משמשת כדי לקבל הגשות מטפסים קיימים שלא נוצרו באמצעות עורך הטפסים של Customer Insights - Journeys. לכידת טופס מומלצת אם הטופס הקיים שלך שולח הגשות גם למערכות שאינן Dynamics 365, או אם הטופס הקיים מכיל לוגיקה מורכבת שלא ניתן ליצור מחדש בקלות בעורך הטפסים של Customer Insights - Journeys. אם ניתן ליצור מחדש את הטופס הקיים באמצעות עורך הטפסים של Customer Insights - Journeys, לא מומלץ להשתמש בתכונת לכידת הטופס.

לכידת טופס משתמשת באותו API כמו הטפסים הסטנדרטיים לעיבוד הגשות. אותה הודעת אבטחה חלה לגבי לכידת טופס.

חשוב

לכידת טופס דורשת סיוע מפתח. תמיד קל יותר ליצור טופס באמצעות ‎עורך הטפסים של Customer Insights - Journeys ולהטמיע אותו בדף הקיים שלך.

חשוב

ללכידת טופס יש צורך בגירסת פתרון DynamicsMKT_Forms 1.1.35355 ומעלה. בעת הקצאת מופע של גירסת ניסיון, לא תמיד תהיה לך את הגירסה העדכנית ביותר באופן אוטומטי. ודא שעדכנת את Customer Insights - Journeys לפני הניסיון ללכוד טופס.

אפשר לכידת טופס

תכונת לכידת הטופס מושבתת כברירת מחדל. אפשר להפעיל את הלחצן הדו-מצבי לכידת טופס בהגדרות>מתגי תכונות>טפסים.

איך עובדת לכידת טופס

לכידת טופס מחקה שליחת טופס Customer Insights - Journeys סטנדרטי. כדי לקשר הגשות של הטופס הקיים שלך ל- Customer Insights - Journeys, עליך ליצור טופס באמצעות עורך הטפסים של Customer Insights - Journeys. לאחר שתפרסם את הטופס הזה, תוכל לקבל סקריפט לכידת טופס, שיש להטמיע בדף האינטרנט המכיל את הטופס הקיים שלך. הסקריפט כולל את הגדרת המיפוי הקיים של שדות טופס בתכונות של ישות ההפניה או איש הקשר. אתה יכול לראות את כל ההגשות והניתוחים בתוך Customer Insights - Journeys. אתה יכול גם להשתמש בטופס זה בתיאום מסע עם הגורם המפעיל טופס שיווק הוגש. שליחת טופס זה יכולה גם ליצור או לעדכן את הסכמת נקודת יצירת קשר ומטרות או נושאים קשורים.

הדרכה מפורטת על לכידת טפסים

יצירת לכידת הטופס בעורך הטפסים של Customer Insights - Journeys

1. ליצירת סקריפט חדש של לכידת טופס, עבור אל Customer Insights - Journeys>ערוצים>טפסים ובחר בחדש בסרגל הפקודות.

2. תן שם לטופס ובחר את קהל הנכון. בחירת קהל היעד היא חשובה. שדה סקריפט לכידת הטופס-> מיפוי תכונות זמין רק עבור תכונות של קהל היעד שנבחר (ישות).

3. הוסף את כל השדות שברצונך למפות לשדות הטופס הקיימים שלך. שלב זה אינו חובה; מיפוי שדה > תכונה מוגדר בקוד לכידת הטופס. הוספת השדות הנכונים לטופס יוצרת מצייני מיקום למיפוי תכונות בסקריפט לכידת הטופס, מה שהופך את הגדרת המיפוי לקלה יותר.

4. הוסף רכיבי הסכמה, כמו מטרה או נושא כדי ליצור ולהגדיר אותם. קבל מידע נוסף על ניהול הסכמה עבור הודעות טקסט ודואר אלקטרוני ב- Customer Insights - Journeys.

   חשוב

   הגדרת ההסכמה חייבת להיעשות בעורך הטפסים. המערכת תתעלם משינויים שבוצעו בהגדרות ההסכמה שנעשו במקטע קוד של לכידת הטופס.

5. הוסף לחצן שליחה. לחצן השליחה נדרש לאימות מוצלח של הטופס לפני הפרסום.

6. פרסם את הטופס באמצעות הלחצן פרסם בפינה הימנית העליונה של המסך. העתק את מקטע קוד של לכידת הטופס והטמע את מקטע הקוד בדף האינטרנט שלך עם הטופס הקיים, או מסור את מקטע הקוד למפתח שלך. מקטע הקוד כבר כולל קישור לתיעוד כדי להנחות את המפתח.

   

   חשוב

   יש להפעיל את שם הדומיין שבו מתארח הטופס הקיים שלך עבור אירוח טפסים חיצוני, אחרת שליחת הטופס לא תיקלט. קבל מידע נוסף על אימות תחומים.

הטמעת סקריפט הלכידה בדף שלך והגדרת המיפוי

מקטע הקוד שהועתק בשלב הקודם הוא תבנית ויש להתאים אותו למקרה השימוש הספציפי. עליך להחליף את כל הרכיבים המסומנים כ- ***Please fill*** בתבנית שנוצרה ולהתאים את ההיגיון לתרחיש שלך.

הגשת הטופס הקיים שלך נשלחת אל Customer Insights - Journeys באמצעות JavaScript API, המוגדר בקובץ FormCapture.bundle.js והוא כלול במקטע.

הגדרת לכידת הטפסים מורכבת מהשלבים הבאים:

1. קבל את ההפניה לרכיב הטופס בדף.
2. הגדר את המיפוי של שדות טופס בשדות (תכונות ישות) ב- Customer Insights - Journeys.
3. הגדר את המיפוי של שדות ההסכמה במודל הסכמה ב- Customer Insights - Journeys.
4. שלח את הגשת הטופס אל Customer Insights - Journeys.

1. קבלת הפניה לרכיב הטופס

כדי לקבל הפניה לרכיב הטופס, אתה יכול להשתמש בפונקצייה המסייע waitForElement. זה גם עובד עם רכיבים המוצגים באופן דינמי ומחזיר הבטחה שנפתרת ברגע שהרכיב עם הבורר הנתון נמצא בדף. להתייחסות לבוררי CSS, ראה תיעוד.

דוגמה:

<form id="form1">
...
</form>

<script>
d365mktformcapture.waitForElement("#form1").then(form => {
  ...
});
</script>

2. הגדרת המיפוי של שדות הטופס

יש למפות שדות בטופס לשדות המתאימים (תכונות ישות) ב- Customer Insights - Journeys. המיפוי מוגדר בפונקציה d365mktformcapture.serializeForm(form, mappings).

דוגמה:

<form id="form1">
  <p>FirstName: <input type="text" name="firstName"/></p>
</form>

<script>
d365mktformcapture.waitForElement("#form1").then(form => {
  const mappings = [
    {
      FormFieldName: "firstName",
      DataverseFieldName: "firstname",
    },
  ];

  ...
  
  const serializedForm = d365mktformcapture.serializeForm(form, mappings);
  // console.log(JSON.stringify(serializedForm)); // NOTE: enable for debugging
  const payload = serializedForm.SerializedForm.build();
});
</script>

הפרמטר form מאחזר על ידי הפונקציה waitForElement שמתוארת בסעיף הקודם. הפרמטר mappings הוא מערך עם רכיבים במבנה הבא:

export interface IFormFieldMapping {
    FormFieldName?: string; // name of form field
    DataverseFieldName: string; // name of field on Dynamics 365 side
    DataverseFieldValue?: string | IFormValueMapping[]; // optional - either a fixed value or a value mapping
}

export interface IFormValueMapping {
    FormValue: string; // form field value
    DataverseValue: string; // mapped value for that form field value that will be sent to Dynamics 365
}

הפונקציה היא סינכרונית ומחזירה את תוצאת הסידרה עם החוזה הבא:

export interface IFormSerializationResult {
    FormFieldMappingResults: IFormFieldMappingResult[]; // Status for each of the defined mappings
    SerializedForm: IFormSerializationBuilder; // The serialized form
}

export interface IFormFieldMappingResult {
    Mapping: IFormFieldMapping; // The defined mapping
    FormFieldMappingStatus: FormFieldMappingStatus; // Status of the mapping (see below for status values)
    Message: string; // Optional - an error/warning message for the mapping
}

export enum FormFieldMappingStatus {
    Success = 0,
    NotFound = 1,
    Error = 2
}

ודא שאתה מטפל בכל השגיאות המוחזרות על ידי FormFieldMappingResults. אתה יכול ליצור את תוכן המנה ל- Customer Insights - Journeys על ידי קריאת serializedForm.SerializedForm.build().

2.1 מיפוי של שדות OptionSet

עבור שדות OptionSet, עליך להגדיר את המיפוי לערך המתאים שאמור להיות מאוחסן ב- Customer Insights - Journeys. אתה יכול למפות את ערכי השדות הקיימים בטופס OptionSet במאפיין DataverseFieldValue .

דוגמה:

<form id="form1">
  <p>Radio: <input type="radio" name="radioInput" value="option1"/><input type="radio" name="radioInput" value="option2"/></p>
</form>

<script>
  ...
  const mappings = [
    {
        FormFieldName: "radioInput",
        DataverseFieldName: "dvradioInput",
        DataverseFieldValue: [ 
            { FormValue: "option1", DataverseValue: "1" }, 
            { FormValue: "option2", DataverseValue: "2" },
        ]
    },
  ];
  ...
</script>

2.2 מיפוי של שדות בדיקת מידע

הגדר את ערך ברירת המחדל עבור שדה בדיקת מידע

אתה יכול להשתמש בערכים סטטיים (ברירת מחדל) בלוגיקת המיפוי עבור שדות בדיקת מידע. עליך להגדיר את שם השדה ואת הערך שיש לאחסן ב- Customer Insights - Journeys.

דוגמה:

<form id="form1">
  ...
</form>

<script>
  ...
  const mappings = [
    {
        DataverseFieldName: "currency",
        DataverseFieldValue: "{\"Id\":\"ffffd6c1-b32d-ee11-bdf3-6045bded6105\",\"LogicalName\":\"transactioncurrency\"}"
    },
  ];
  ...
</script>

מפה את הערך של שדה החיפוש לשדה בטופס שלך

אתה יכול גם למפות את ערך שדה החיפוש לערך מתאים בשדה הטופס הקיים.

דוגמה:

<form id="form1">
  <p>Radio: <input type="radio" name="currency" value="usd"/><input type="radio" name="currency" value="eur"/></p>
</form>

<script>
  ...
  const mappings = [
    {
        FormFieldName: "currency",
        DataverseFieldName: "transactioncurrencyid",
        DataverseFieldValue: [ 
              { FormValue: "usd", DataverseValue: "{\"Id\":\"cd2cff48-08a3-ea11-a813-000d3a0a82b4\",\"LogicalName\":\"transactioncurrency\"}", }, 
              { FormValue: "eur", DataverseValue: "{\"Id\":\"91f1a052-259c-4719-a3ae-3a1d2987a3ed\",\"LogicalName\":\"transactioncurrency\"}", }, 
        ]
    },
  ];
  ...
</script>

2.3 מיפוי ערכי שדות מרובים

עבור שדות multi-select, עליך להגדיר את המיפוי לערך המתאים שאמור להיות מאוחסן ב- Customer Insights - Journeys. אתה יכול למפות ערכי שדות מרובים בטופס הקיים שלך במאפיין DataverseFieldValue.

דוגמה:

  <form id="form1">
    <p>Fieldset: <fieldset name="multiOptionInput">
      <input type="checkbox" name="multiOptionInput" value="100000000">0</input>
      <input type="checkbox" name="multiOptionInput" value="100000001">1</input>
      <input type="checkbox" name="multiOptionInput" value="100000002">2</input>
    </fieldset></p>
  </form>
 
<script>
...
const mappings = [
  {
    FormFieldName: "multiOptionInput",
    DataverseFieldName: "dvmultiOptionInput",
    DataverseFieldValue: [
      { FormValue: "100000000", DataverseValue: "0" },
      { FormValue: "100000001", DataverseValue: "1" },
      { FormValue: "100000002", DataverseValue: "2" },
    ]
  },
];
...
</script>

3. הגדר את מיפוי שדות ההסכמה

יש להגדיר שדות הסכמה בעורך הטפסים ב- Customer Insights - Journeys. המיפויים DataverseFieldName ו- DataverseFieldValue מופקים אוטומטית בהתאמה.

דוגמה:

<form id="form1">
  <p>Consent: <input type="checkbox" name="consentField"/></p>
</form>

<script>
  ...
  const mappings = [
    {
        FormFieldName: "consentField",
        DataverseFieldName: "msdynmkt_purposeid;channels;optinwhenchecked",
        DataverseFieldValue: "10000000-0000-0000-0000-000000000004;Email;true",
    },
  ];
  ...
</script>

4. שליחת הגשת הטופס אל Customer Insights - Journeys

לאחר שתקבל הפניה לטופס, הגדר המיפויים וערוך את הטופס בסידרה, תוכל להוסיף מאזין אירועים לאירוע submit ולשלוח אותו באמצעות הפונקציה d365mktformcapture.submitForm(captureConfig, payload). קריאה זו מחזירה הבטחה, וניתן לטפל בשגיאות בלוגיקת catch .

חשוב

אם יש לך אימות מותאם אישית או בדיקת Captcha, ודא שאתה שולח את הטופס ל- Customer Insights - Journeys רק במקרה של אימות מוצלח (לדוגמה, בדוק את isDefaultPrevented באירוע submit או קרא מפורשת אל submitForm רק לאחר שהאימות עובר)

דוגמה:

<form id="form1">
  <p>FirstName: <input type="text" name="firstName"/></p>
</form>

<script>
d365mktformcapture.waitForElement("#form1").then(form => {
  const mappings = [
    {
      FormFieldName: "firstName",
      DataverseFieldName: "firstname",
    },
  ];

  form.addEventListener("submit", (e) => {
    const serializedForm = d365mktformcapture.serializeForm(form, mappings);
    // console.log(JSON.stringify(serializedForm)); // NOTE: enable for debugging
    const payload = serializedForm.SerializedForm.build();

    const captureConfig = {
      FormId: "...", // the form id on Dynamics 365 side
      FormApiUrl: "..." // the API url of the Dynamics 365 backend service where the form will be submitted to
    }
    d365mktformcapture.submitForm(captureConfig, payload)
    .catch(e => {
      // error handling
    });
  }, true);
});
</script>

‏‫פתרון בעיות

הקריאה לנקודת קצה של הגשה נכשלת עם שגיאת CORS

שיתוף משאבים בין מקורות (CORS) עלול לגרום לכישלון בלכידת שליחת טופס. הפוך את הדומיין שלך לזמין עבור אירוח טופס חיצוני. קבל מידע נוסף על אימות תחומים.

ערכי ההסכמה אינם מעודכנים כהלכה

ודא שהגדרת את שדות ההסכמה המתאימים בעורך הטפסים (ראה סעיף יצירת לכידת הטופס בעורך הטפסים של Customer Insights - Journeys) ושהשתמשת במיפויים הנכונים שנוצרו בתהליך הפרסום.