Thu nạp biểu mẫu trong Customer Insights - Journeys

Bài viết
04/29/2024

Tính năng chụp biểu mẫu được dùng để nhận nội dung gửi từ các biểu mẫu hiện có không được tạo bằng cách sử dụng Customer Insights - Journeys công cụ biên tập biểu mẫu. Bạn nên chụp biểu mẫu nếu biểu mẫu hiện tại của bạn cũng gửi nội dung gửi đến các hệ thống khác ngoài Dynamics 365 hoặc nếu biểu mẫu hiện có chứa logic phức tạp không thể dễ dàng tạo lại trong Customer Insights - Journeys công cụ biên tập biểu mẫu. Nếu có thể tạo lại biểu mẫu hiện có bằng Customer Insights - Journeys công cụ biên tập biểu mẫu thì không nên sử dụng tính năng chụp biểu mẫu.

Chụp biểu mẫu sử dụng API giống như các biểu mẫu tiêu chuẩn để xử lý việc gửi. Điều tương tự thông báo bảo mật áp dụng cho việc chụp biểu mẫu.

Quan trọng

Việc chụp biểu mẫu cần có sự hỗ trợ của nhà phát triển. Việc tạo biểu mẫu bằng cách sử dụng Customer Insights - Journeys công cụ biên tập biểu mẫu và nhúng nó vào trang hiện tại của bạn luôn dễ dàng hơn.

Quan trọng

Việc chụp biểu mẫu yêu cầu phiên bản giải pháp DynamicsMKT_Forms 1.1.35355 trở lên. Khi cung cấp phiên bản dùng thử, không phải lúc nào bạn cũng tự động có phiên bản mới nhất. Hãy đảm bảo rằng bạn đã cập nhật Customer Insights - Journeys trước khi thử chụp biểu mẫu.

Bật tính năng chụp biểu mẫu

Tính năng chụp biểu mẫu bị tắt theo mặc định. Bạn có thể bật Chụp biểu mẫu chuyển đổi trong Cài đặt>Chuyển đổi tính năng>Biểu mẫu.

Bật tính năng chụp biểu mẫu trong các chuyển đổi tính năng.

Cách hoạt động của tính năng chụp biểu mẫu

Chụp biểu mẫu bắt chước việc gửi biểu mẫu Customer Insights - Journeys chuẩn. Để liên kết việc gửi biểu mẫu hiện tại của bạn với Customer Insights - Journeys, bạn cần tạo biểu mẫu bằng cách sử dụng Customer Insights - Journeys công cụ biên tập biểu mẫu. Sau khi xuất bản biểu mẫu đó, bạn có thể nhận được tập lệnh chụp biểu mẫu, tập lệnh này cần được nhúng vào trang web chứa biểu mẫu hiện có của bạn. Tập lệnh bao gồm định nghĩa về ánh xạ các trường biểu mẫu hiện có trên các thuộc tính của thực thể khách hàng tiềm năng hoặc người liên hệ. Bạn có thể xem tất cả nội dung gửi và phân tích bên trong Customer Insights - Journeys. Bạn cũng có thể sử dụng biểu mẫu này trong việc điều phối hành trình với trình kích hoạt Đã gửi biểu mẫu tiếp thị . Việc gửi biểu mẫu này cũng có thể tạo hoặc cập nhật Sự đồng ý của Điểm liên hệ và các Mục đích hoặc Chủ đề liên quan.

Hướng dẫn từng bước chụp biểu mẫu

Tạo bản chụp biểu mẫu trong Customer Insights - Journeys công cụ biên tập biểu mẫu

Để tạo tập lệnh chụp biểu mẫu mới, hãy chuyển đến Customer Insights - Journeys>Kênh>Biểu mẫu và chọn Mới trên thanh lệnh.
Đặt tên cho biểu mẫu và chọn đúng đối tượng. Việc lựa chọn đối tượng mục tiêu là quan trọng. Ánh xạ thuộc tính trường tập lệnh chụp biểu mẫu->chỉ có sẵn cho các thuộc tính của đối tượng mục tiêu (thực thể) đã chọn.
Thêm tất cả các trường bạn muốn ánh xạ tới các trường biểu mẫu hiện có của bạn. Bước này không bắt buộc; trường > thuộc tính ánh xạ được xác định trong mã chụp biểu mẫu. Việc thêm các trường phù hợp vào biểu mẫu sẽ tạo ra các phần giữ chỗ để ánh xạ thuộc tính trong tập lệnh chụp biểu mẫu, giúp việc xác định ánh xạ trở nên dễ dàng hơn.
Thêm các thành phần đồng ý như Mục đích hoặc Chủ đề để hình thành và định cấu hình chúng. Tìm hiểu thêm về cách quản lý sự đồng ý đối với email và tin nhắn văn bản trong Customer Insights - Journeys.

Quan trọng

Việc xác định sự đồng ý phải được thực hiện trong công cụ biên tập biểu mẫu. Những thay đổi đối với chế độ cài đặt sự đồng ý được thực hiện trong quá trình thu thập biểu mẫu đoạn mã sẽ bị bỏ qua.
Thêm nút Gửi . Nút gửi là cần thiết để xác thực thành công biểu mẫu trước khi xuất bản.
Xuất bản biểu mẫu bằng nút Xuất bản ở góc trên cùng bên phải của màn hình. Sao chép bản chụp biểu mẫu đoạn mã và nhúng đoạn mã vào trang web của bạn bằng biểu mẫu hiện có hoặc chuyển đoạn mã cho nhà phát triển của bạn. đoạn mã đã bao gồm liên kết tới tài liệu hướng dẫn nhà phát triển của bạn.

Quan trọng

Tên miền nơi lưu trữ biểu mẫu hiện tại của bạn phải được bật để lưu trữ biểu mẫu bên ngoài, nếu không quá trình gửi biểu mẫu sẽ không được ghi lại. Tìm hiểu thêm về xác thực miền.

Nhúng tập lệnh chụp vào trang của bạn và định nghĩa ánh xạ

đoạn mã được sao chép ở bước trước là một mẫu và phải được điều chỉnh cho phù hợp với trường hợp sử dụng cụ thể. Bạn cần thay thế tất cả các thành phần được đánh dấu là ***Please fill*** trong mẫu đã tạo và điều chỉnh logic cho phù hợp với kịch bản của bạn.

Biểu mẫu gửi hiện tại của bạn sẽ được gửi tới Customer Insights - Journeys bằng cách sử dụng API JavaScript, được xác định trong tệp FormCapture.bundle.js và được bao gồm trong đoạn mã.

Quá trình thiết lập chụp biểu mẫu bao gồm các bước sau:

Lấy tham chiếu đến phần tử biểu mẫu trên trang.
Xác định ánh xạ các trường biểu mẫu trên các trường (thuộc tính thực thể) trong Customer Insights - Journeys.
Xác định ánh xạ của các trường đồng ý trên mô hình đồng ý trong Customer Insights - Journeys.
Gửi biểu mẫu gửi tới Customer Insights - Journeys.

1. Lấy tham chiếu đến phần tử biểu mẫu

Để tham chiếu đến thành phần biểu mẫu, bạn có thể sử dụng hàm trợ giúp waitForElement . Nó cũng hoạt động với các phần tử được hiển thị động và trả về một lời hứa được giải quyết sau khi tìm thấy phần tử có bộ chọn đã cho trên trang. Để tham khảo CSS bộ chọn, hãy xem tài liệu này.

Ví dụ:

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

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

2. Xác định ánh xạ các trường biểu mẫu

Các trường trong biểu mẫu cần được ánh xạ tới các trường tương ứng (thuộc tính thực thể) trong Customer Insights - Journeys. Ánh xạ được xác định trong hàm d365mktformcapture.serializeForm(form, mappings).

Ví dụ:

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

Tham số form được truy xuất bằng hàm waitForElement được mô tả trong phần trước. Tham số mappings là một mảng có các phần tử có cấu trúc sau:

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
}

Hàm này đồng bộ và trả về kết quả tuần tự hóa với hợp đồng sau:

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
}

Đảm bảo rằng bạn xử lý tất cả các lỗi được trả về bởi FormFieldMappingResults. Bạn có thể tạo tải trọng tới Customer Insights - Journeys bằng cách gọi serializedForm.SerializedForm.build().

2.1 Ánh xạ các trường Bộ tùy chọn

Đối với các trường OptionSet , bạn cần xác định ánh xạ tới giá trị tương ứng sẽ được lưu trữ trong Customer Insights - Journeys. Bạn có thể ánh xạ các giá trị trường Bộ tùy chọn trong biểu mẫu hiện có của mình trong thuộc tính DataverseFieldValue .

Ví dụ:

<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 Ánh xạ các trường tra cứu

Đặt giá trị mặc định cho trường tra cứu

Bạn có thể sử dụng các giá trị tĩnh (mặc định) trong logic ánh xạ cho các trường tra cứu. Bạn cần xác định tên của trường và giá trị sẽ được lưu trữ trong Customer Insights - Journeys.

Ví dụ:

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

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

Ánh xạ giá trị của trường tra cứu tới một trường trong biểu mẫu của bạn

Bạn cũng có thể ánh xạ giá trị trường tra cứu tới giá trị tương ứng trong trường biểu mẫu hiện có của mình.

Ví dụ:

<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 Ánh xạ các giá trị trường có nhiều lựa chọn

Đối với các trường multi-select , bạn cần xác định ánh xạ tới giá trị tương ứng sẽ được lưu trữ trong Customer Insights - Journeys. Bạn có thể ánh xạ các giá trị trường chọn nhiều biểu mẫu hiện có của mình trong thuộc tính DataverseFieldValue .

Ví dụ:

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

Các trường đồng ý cần được định cấu hình trong công cụ biên tập biểu mẫu trong Customer Insights - Journeys. Ánh xạ DataverseFieldName và DataverseFieldValue được tạo tự động tương ứng.

Ví dụ:

<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. Gửi biểu mẫu tới Customer Insights - Journeys

Sau khi nhận được tham chiếu đến biểu mẫu, xác định ánh xạ và tuần tự hóa biểu mẫu, bạn có thể thêm trình xử lý sự kiện vào sự kiện submit và gửi nó bằng hàm d365mktformcapture.submitForm(captureConfig, payload) . Lệnh gọi này trả về một lời hứa và các lỗi có thể được xử lý theo logic catch .

Quan trọng

Nếu bạn có sẵn quy trình xác thực tùy chỉnh hoặc kiểm tra hình ảnh xác thực, hãy đảm bảo rằng bạn chỉ gửi biểu mẫu tới Customer Insights - Journeys trong trường hợp xác thực thành công (ví dụ: kiểm tra isDefaultPrevented trên submit sự kiện hoặc gọi rõ ràng submitForm chỉ sau khi quá trình xác thực vượt qua)

Ví dụ:

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

Gỡ rối

Cuộc gọi đến điểm cuối gửi không thành công do lỗi CORS

Chia sẻ tài nguyên nhiều nguồn gốc (CORS) có thể khiến việc gửi biểu mẫu không thành công. Kích hoạt miền của bạn để lưu trữ biểu mẫu bên ngoài. Tìm hiểu thêm về xác thực miền.

Đảm bảo rằng bạn đã thiết lập các trường chấp thuận tương ứng trong công cụ biên tập biểu mẫu (xem Tạo bản chụp biểu mẫu trong Customer Insights - Journeys công cụ biên tập biểu mẫu) và rằng bạn 'đã sử dụng ánh xạ chính xác được tạo trong quá trình xuất bản.

Chia sẻ qua

Thu nạp biểu mẫu trong Customer Insights - Journeys

Bật tính năng chụp biểu mẫu

Cách hoạt động của tính năng chụp biểu mẫu

Hướng dẫn từng bước chụp biểu mẫu

Tạo bản chụp biểu mẫu trong Customer Insights - Journeys công cụ biên tập biểu mẫu

Nhúng tập lệnh chụp vào trang của bạn và định nghĩa ánh xạ

1. Lấy tham chiếu đến phần tử biểu mẫu

2. Xác định ánh xạ các trường biểu mẫu

2.1 Ánh xạ các trường Bộ tùy chọn

2.2 Ánh xạ các trường tra cứu

Đặt giá trị mặc định cho trường tra cứu

Ánh xạ giá trị của trường tra cứu tới một trường trong biểu mẫu của bạn

2.3 Ánh xạ các giá trị trường có nhiều lựa chọn

4. Gửi biểu mẫu tới Customer Insights - Journeys

Gỡ rối

Cuộc gọi đến điểm cuối gửi không thành công do lỗi CORS

Tài nguyên bổ sung

Chia sẻ qua

Thu nạp biểu mẫu trong Customer Insights - Journeys

Bật tính năng chụp biểu mẫu

Cách hoạt động của tính năng chụp biểu mẫu

Hướng dẫn từng bước chụp biểu mẫu

Tạo bản chụp biểu mẫu trong Customer Insights - Journeys công cụ biên tập biểu mẫu

Nhúng tập lệnh chụp vào trang của bạn và định nghĩa ánh xạ

1. Lấy tham chiếu đến phần tử biểu mẫu

2. Xác định ánh xạ các trường biểu mẫu

2.1 Ánh xạ các trường Bộ tùy chọn

2.2 Ánh xạ các trường tra cứu

Đặt giá trị mặc định cho trường tra cứu

Ánh xạ giá trị của trường tra cứu tới một trường trong biểu mẫu của bạn

2.3 Ánh xạ các giá trị trường có nhiều lựa chọn

3. Xác định ánh xạ trường đồng ý

4. Gửi biểu mẫu tới Customer Insights - Journeys

Gỡ rối

Cuộc gọi đến điểm cuối gửi không thành công do lỗi CORS

Giá trị đồng ý được cập nhật không chính xác

Tài nguyên bổ sung