使用 Edge Delivery Services 在自適應表單中設定預填服務
表單預填是指使用者開啟表單時,自動使用來自外部來源的相關資料填入表單欄位的過程。善用來自使用者設定檔、資料庫、已儲存的草稿或其他後端系統的資訊,透過預填簡化表單填寫體驗,減少手動輸入、盡量減少錯誤並加速完成填寫。這不僅提升使用者滿意度,也增加表單提交成功的可能性。
預填表單的優點
預填的運作原理
下圖說明使用者開啟自適應表單時發生的自動預填過程:
預填過程涵蓋四個關鍵步驟:
- 使用者開啟表單:使用者透過 URL 或導覽存取自適應表單
- 確認資料來源:預填服務會決定所設定的資料來源 (表單資料模型或草稿服務)
- 檢索資料:系統根據內容關聯性、參數或使用者身分取得相關使用者資料
- 對應和顯示:使用
bindRef屬性將資料對應到表單欄位,並向使用者顯示已填入資料的表單
此自動化流程可確保使用者看到預先填入相關資訊的表單,從而顯著提高使用者體驗和表單完成率。
預填的資料結構
自適應表單支援兩種類型的欄位:
- 繫結欄位:透過非空白
bindRef屬性連接到資料來源的欄位 - 未繫結欄位:具空白
bindRef值的獨立欄位
預填資料結構包括:
- afBoundData:包含繫結欄位和面板的資料
- afUnBoundData:包含未繫結欄位的資料
資料格式必須符合您的表單模型:
- XFA 表單:符合 XFA 範本結構描述的 XML
- XML 結構描述表單:與結構描述結構相符的 XML
- JSON 結構描述表單:符合結構描述的 JSON
- 表單資料模型 (FDM) 表單:與 FDM 結構相符的 JSON
- 無結構描述表單:所有欄位均未繫結,並使用未繫結的 XML
先決條件
在設定預填服務之前,請確保您符合以下條件:
必要設定
存取要求
- AEM Forms as a Cloud Service 存取權
- 建立和編輯表單的權限
- 通用編輯器存取權並啟用必要的擴充功能
預填服務選項
通用編輯器提供兩種預填服務選項:
詳細比較
設定表單的預填服務
步驟 1:建立表單資料模型
-
登入您的 AEM Forms as a Cloud Service 實例
-
導覽至「Adobe Experience Manager」>「表單」>「資料整合」
-
選取「建立」>「表單資料模型」
-
選擇您的「資料來源設定」並選取已設定的「資料來源」
note tip TIP 有關建立表單資料模型的詳細說明,請參閱 建立表單資料模型。
步驟 2:設定 FDM 服務
-
前往「Adobe Experience Manager」>「表單」>「資料整合」
-
以編輯模式開啟表單資料模型
-
選取一個資料模型物件並按一下「編輯屬性」
-
針對所選取資料模型物件設定 閱讀 和 寫入 服務
-
設定服務引數:
- 按一下讀取服務引數的編輯圖示
- 將引數繫結到「使用者設定檔屬性」、「請求屬性」或者「常值」
- 指定繫結值 (例如,用於寵物登記表的)
petid
-
按一下「完成」以儲存引數,並按一下「儲存」以儲存 FDM
note note NOTE 參閱使用表單資料模型 (FDM),了解更多關於設定 FDM 服務的詳細資訊。
步驟 3:建立自適應表單
-
導覽至「Adobe Experience Manager」>「表單」>「表單與文件」
-
選取「建立」>「自適應表單」
-
在「來源」索引標籤中,選取一個 Edge Delivery Services 範本:
-
按一下「建立」來開啟 建立表單 精靈
您可以從「資料」索引標籤或稍後透過編輯表單屬性來設定資料來源。
-
指定表單詳細資料:
- 名稱:輸入表單的說明性名稱
- 標題:提供簡單易懂的標題
- GitHub URL:輸入您的存放庫 URL (例如
https://github.com/wkndforms/edsforms)
-
按一下「建立」
表單會在通用編輯器中開啟以供製作。
步驟 4:設定表單資料來源
-
選取您的表單然後按一下「屬性」
-
開啟「表單模型」標籤
-
從「選取來源」下拉式選單,選擇「表單資料模型 (FDM)」
-
從下拉式選單中選取您建立的表單資料模型 (例如 PetFDM)
-
按一下「儲存並關閉」
-
在通用編輯器中開啟表單進行編輯
FDM 中的表單元素出現在 內容瀏覽器 的「資料來源」標籤中。
步驟 5:把資料繫結新增到表單欄位
-
從「資料來源」標籤中選取資料元素
-
按一下「新增」或拖放元素來建置表單
-
新增資料繫結至表單欄位:
-
選取表單欄位
-
在「屬性」面板中,找到「繫結參考」屬性
-
選取適當的資料繫結參考
-
步驟 6:啟用必要的擴充功能
確保在通用編輯器中啟用這些擴充功能:
-
AEM 表單屬性擴充功能
- 在通用編輯器中開啟 Extension Manager
- 啟用 AEM 表單屬性 擴充功能
-
資料來源擴充功能
- 如果您沒有看到「資料來源」圖示,請啟用 資料來源 擴充功能
note tip TIP 有關管理擴充功能的詳細說明,請參閱 Extension Manager 功能重點介紹。
步驟 7:設定預填服務
-
在通用編輯器中開啟您的自適應表單
-
按一下「AEM 表單屬性」擴充功能圖示
-
按一下「預填」標籤。
-
選取 表單資料模型預填服務
-
按一下「儲存並關閉」
步驟 8:預覽和測試
-
前往「表單」>「表單和文件」
-
選取您的自適應表單
-
選擇「以 HTML 格式預覽」
-
將參數附加到 URL 來測試預填:
https://your-preview-url.com?<bindreferencefield>=<value>範例:
https://your-preview-url.com?petid=12345
表單應根據所提供的參數自動填入資料。
範例
預填資料結構範例
FDM 型表單的 JSON 範例:
{
"afBoundData": {
"user": {
"firstName": "John",
"lastName": "Doe",
"email": "john.doe@example.com",
"phone": "+1-555-0123"
}
},
"afUnBoundData": {
"additionalInfo": "User preferences loaded"
}
}
XFA 型表單的 XML 範例:
<?xml version="1.0" encoding="UTF-8"?>
<afData>
<afBoundData>
<user>
<firstName>John</firstName>
<lastName>Doe</lastName>
<email>john.doe@example.com</email>
</user>
</afBoundData>
</afData>
預填 URL 範例
以下 URL 僅為舉例示意,無法按原樣運作。測試預填功能時,請更換成與您自己的環境相關的主機和參數。
基本預填測試:
https://preview.example.com/form.html?userId=12345
多參數測試:
https://preview.example.com/form.html?userId=12345&category=premium
疑難排解
| table 0-row-3 1-row-3 2-row-3 3-row-3 4-row-3 5-row-3 | ||
|---|---|---|
| 問題 | 可能的原因 | 解決方案 |
| 表單欄位未預填 | 錯誤 bindRef 值 |
確認 bindRef 是否與 FDM 欄位名稱完全相符 |
| 資料格式錯誤 | 資料結構不相符 | 確保預填資料與表單模型結構描述相符 |
| 找不到服務 | FDM 設定問題 | 檢查 FDM 服務是否已正確設定並儲存 |
| 驗證錯誤 | 資料來源連接 | 驗證資料來源認證和連接 |
| 部分資料載入 | 缺少欄位對應 | 確保所有必填欄位都有正確的資料繫結 |
-
驗證 FDM 設定:
- 檢查服務設定是否正確
- 獨立測試 FDM 服務
- 驗證資料來源連接
-
檢查表單設定:
- 確認表單與正確的 FDM 關聯
- 確認欄位
bindRef的值 - 在不先預填的情況下測試表單
-
測試資料流程:
- 使用瀏覽器開發者工具來檢查網路請求
- 檢查控制台是否存在 JavaScript 錯誤
- 驗證回應式資料格式
-
常見錯誤訊息:
- 「未找到預填服務」:檢查服務設定
- 「資料繫結失敗」:驗證
bindRef準確性 - 「無效資料格式」:確保資料與結構描述相符
最佳做法
- 使用說明性命名:清楚地命名您的 FDM 和服務
- 驗證資料結構描述:確保資料結構符合表單要求
- 漸進式測試:一次設定並測試一個欄位
- 文件對應:持續追蹤欄位到資料的對應
- 盡量減少資料量:僅預填必要欄位
- 使用快取:為頻繁存取的資料設定適當的快取
- 最佳化查詢:確保資料庫查詢有效率
- 監視效能:在啟用預填的情況下追蹤表單載入時間
- 驗證輸入參數:持續驗證 URL 參數
- 清理資料:在預填表單之前清理資料
- 實施存取控制:確保使用者只能存取自己的資料
- 使用 HTTPS:始終使用安全連線進行資料傳輸
- 提供回饋:在資料擷取期間顯示載入指示器
- 妥善地處理錯誤:顯示實用的錯誤訊息
- 允許覆蓋:允許使用者修改預先填入的資料
- 保持一致性:在各個表單中使用一致的預填行為
常見問題
?<bindreferencefield>=<value>。確保該欄位具有與您的資料結構相符的有效 bindRef。使用瀏覽器開發工具檢查網路請求並確認是否正確地擷取資料。自適應表單支援多種格式,取決於您的表單模型:
- XFA 表單:與 XFA 結構描述相符的 XML
- JSON 結構描述表單:符合結構描述的 JSON 資料
- FDM 表單:對應到資料模型結構的 JSON
- XML 結構描述表單:與結構描述結構相符的 XML
afBoundData 區段並且必須符合您的表單模型結構描述。未繫結欄位使用 afUnBoundData 區段並且可以包含任何其他資料。bindRef 值,與您的 FDM 完全相符。確認您的資料來源包含所有必填欄位,以及資料結構與您的表單模型結構描述相符。