使用最適化表單的最佳作法 best-practices-for-working-with-adaptive-forms

使用Apache Maven aem-project-archetype來建立和管理AEM專案的結構。 它會為您的AEM專案建立建議的結構和範本。 此外，它還提供建置自動化和變更控制系統，以協助管理專案。

• 使用maven archetype:generate命令產生初始結構。
• 使用maven eclipse:eclipse命令產生eclipse專案檔案，並將專案匯入eclipse。

FileVault工具或VLT可協助您將CRX或AEM執行個體的內容對應至您的檔案系統。 它提供變更控制管理作業，例如AEM專案內容的簽入和簽出。 請參閱如何使用VLT工具。

如果您使用Eclipse整合式開發環境，您可以使用AEM開發人員工具將Eclipse IDE與AEM執行個體緊密整合，以建立AEM應用程式。 如需詳細資訊，請參閱適用於Eclipse的AEM開發人員工具。

請勿在/libs資料夾中儲存任何內容或進行任何修改。 在/app資料夾中建立覆蓋以擴充或覆寫預設功能。

當您建立封裝以移動內容時，請確保封裝篩選路徑正確，並且只提到必要的路徑。

請勿在/libs資料夾中儲存任何內容或進行任何修改。 在/app資料夾中建立覆蓋以擴充或覆寫預設功能。

定義套件的正確相依性，以強制預先決定的安裝順序/順序。

請勿在/libs或/apps中建立任何可參照的節點。

調適型表單範本是專門的AEM頁面，可定義調適型表單的結構和頁首頁尾資訊。 範本有預先設定的最適化表單版面、樣式和基本結構。 AEM Forms提供現成可用的範本和元件，供您製作調適型表單。 不過，您可以根據需求建立自訂範本和元件。 建議您收集最適化表單中所需其他範本和元件的需求。 如需詳細資訊，請參閱自訂最適化表單和元件。

建議您使用表單管理員使用者介面而非使用CRX封裝管理員使用者介面上傳表單套件，因為透過CRX封裝管理員上傳套件有時可能會導致異常。

AEM Forms可讓您根據下清單單模型建立最適化表單。 表單模型可作為表單與AEM系統之間資料交換的介面，並為最適化表單內外資料流提供XML型結構。 此外，表單模型會以結構描述和XFA限制的形式對調適型表單施加規則和限制。

• 無：使用此選項建立的最適化表單不使用任何表單模型。 從此類表單產生的資料 XML 具有包含欄位和對應值的單層結構。
• XML或JSON結構描述： XML和JSON結構描述代表貴組織中後端系統產生或使用資料的結構。 您可以將結構描述關聯至最適化表單，並使用其元素將動態內容新增至最適化表單。 結構描述的元素可在內容瀏覽器的「資料模型物件」標籤中使用，以編寫調適型表單。 您可以拖放結構元素來建置表單。
• XFA表單範本：如果您有投資以XFA為基礎的HTML5表單，這是理想的表單模型。 它可讓您直接將XFA式表單轉換為最適化表單。 任何現有的XFA規則都會保留在關聯的調適型表單中。 產生的調適型表單支援XFA建構，例如驗證、事件、屬性和模式。
• 表單資料模型：如果您想要整合您的後端系統(例如資料庫、Web服務和AEM使用者設定檔)，以預先填寫最適化表單並將提交的表單資料寫入後端系統，這會是您偏好的表單模型。 表單資料模型編輯器可讓您在可用來建立調適型表單的表單資料模型中定義及設定實體和服務。 如需詳細資訊，請參閱AEM Forms資料整合。

AEM Forms提供可用於建立最適化表單的現成最適化表單範本。 您也可以建立自己的範本。 AEM提供靜態和可編輯的範本。

• 靜態範本由開發人員定義和設定。
• 可編輯的範本是由作者使用範本編輯器建立的。 範本編輯器可讓您定義範本中的基本結構和初始內容。 結構圖層中的任何修改都會反映在使用該範本的所有表單中。 初始內容可能包括預先設定的主題、預填服務、提交動作等。 不過，您可以使用表單編輯器修改表單的這些設定。 如需詳細資訊，請參閱最適化表單範本。

若要設定特定欄位或面板執行個體的樣式，請使用內嵌樣式。 或者，您可以在CSS檔案中定義類別，並在元件的CSS Class屬性中指定類別名稱。

在元件中加入使用者端資料庫，以便一致地套用樣式至使用該元件的調適型表單或片段。 如需詳細資訊，請參閱建立最適化表單頁面元件。

透過在適用性表單容器屬性的CSS檔案路徑欄位中指定使用者端資料庫的路徑，套用使用者端資料庫中定義的樣式以選取適用性表單。

若要建立樣式的使用者端資料庫，您可以在主題編輯器基底clientlib或表單容器屬性中設定自訂CSS檔案。

調適型表單提供面板配置，例如回應式、索引標籤、摺疊式功能表和精靈，以控制表單元件在面板中的配置方式。 您可以建立自訂面板版面配置，並讓表單作者可以使用它們。 如需詳細資訊，請參閱建立最適化表單的自訂配置元件。

您也可以自訂特定的最適化表單元件，例如欄位和面板版面配置。

• 使用AEM的覆蓋功能來修改元件的復本。 不建議修改預設元件。
• 若要自訂/libs中現成可用的最適化表單元件的版面，除了預設版面之外，還要建立自訂版面元件。
• 透過建立自訂Widget或外觀來引入自訂互動。 不建議修改預設元件。 如需詳細資訊，請參閱外觀架構。

如需處理PII資料的建議，請參閱處理個人識別資訊。

使用側邊欄中的物件瀏覽器，快速存取表單階層中下方的欄位。 您可以使用搜尋方塊來搜尋表單或物件樹中的物件，以便從一個物件瀏覽至另一個物件。

若要在側邊欄的元件瀏覽器中檢視和編輯元件的屬性，請選取該元件，然後按一下 。 您也可以連按兩下元件，以在屬性瀏覽器中檢視其屬性。

使用鍵盤快速鍵對您的表單執行快速動作。 請參閱AEM Forms鍵盤快速鍵。

建議僅將最適化表單元件用於最適化表單頁面。 元件與其父項階層具有相依性。 因此，請勿在AEM頁面中使用這些引數。

針對表單欄位和元件使用有意義且唯一的名稱，以避免在撰寫規則時可能發生任何衝突。

對元件使用this運運算元，以在規則運算式中參照自身。 這可確保即使元件名稱變更，規則仍保持有效。 例如，field1.valueCommit script: this.value > 10。

參照其他表單元件時使用元件名稱。 使用value屬性來擷取欄位或元件的值。 例如，field1.value。

按相對唯一階層參照元件，以避免任何衝突。 例如，parentName.fieldName。

處理複雜或常用的規則時，請考慮將商業邏輯寫入個別的使用者端程式庫中，以便您指定並在適用性表單中重複使用。 使用者端程式庫應為獨立程式庫，且不應有任何外部相依性，jQuery和Underscore.js除外。 您也可以使用使用者端程式庫來強制執行伺服器端重新驗證提交的表單資料。

調適型表單提供了一組API，您可以使用這些API與調適型表單通訊及執行動作。 部分重要API如下。 如需詳細資訊，請參閱最適化Forms的JavaScript資料庫API參考。

• guideBridge.reset()：重設表單。

• guideBridge.submit()：提交表單。

• guideBridge.setFocus(somExp, focusOption, runCompletionExp)：將焦點設定為欄位。

• guideBridge.validate(errorList, somExpression, focus)：驗證表單。

• guideBridge.getDataXML(options)：以XML格式取得表單資料。

• guideBridge.resolveNode(somExpression)：取得表單物件。

• guideBridge.setProperty(somList, propertyName, valueList)：設定表單物件的屬性。

• 此外，您可以使用以下欄位屬性：

  • field.value以變更欄位的值。
  • field.enabled以啟用/停用欄位。
  • field.visible以變更欄位的可見度。

最適化表單作者可能需要撰寫JavaScript程式碼，才能在表單中建置商業邏輯。 雖然JavaScript功能強大且有效，但可能會影響安全性預期。 因此，您必須確保表單作者是受信任的角色，而且在表單投入生產之前，有程式可檢閱和核准JavaScript程式碼。 管理員可以根據使用者群組的角色或功能，限制使用者群組對規則編輯器存取權的存取權。 請參閱將規則編輯器存取權授與選取的使用者群組。

您可以在規則中使用運算式，讓調適型表單成為動態表單。 所有運算式都是有效的JavaScript運算式，並使用適用性表單指令碼模型API。 這些運算式會傳回某些型別的值。 如需運算式和相關最佳實務的詳細資訊，請參閱最適化表單運算式。

Adobe建議在使用規則編輯器建立規則時，比非同步操作使用JavaScript同步操作。 強烈建議不要使用非同步操作。 不過，如果您發現自己無法避免非同步操作，實施JavaScript關閉函式就十分重要。 如此一來，您便可針對任何可能的競爭條件有效進行保護，確保您的規則實作可提供最佳效能並維持整體的穩定性。

例如，假設我們需要從外部API擷取資料，然後根據該資料套用一些規則。 我們使用關閉來處理非同步API呼叫，並確保在擷取資料後套用規則。 以下是範常式式碼：

     function fetchDataFromAPI(apiEndpoint, callback) {
      // Simulate asynchronous API call with setTimeout
      setTimeout(() => {
        // Assuming the API call is successful, we receive some data
        const data = {
          someValue: 42,
        };
        // Invoke the callback with the fetched data
        callback(data);
      }, 2000); // Simulate a 2-second delay for the API call
    }
    // Rule implementation using Closure
    function ruleImplementation(apiEndpoint) {
      // Using a closure to handle the asynchronous API call and rule application
      // say you have set this value in street field inside address panel
      var streetField = address.street;
      fetchDataFromAPI(apiEndpoint, (data) => {
        streetField.value = data.someValue;
      });
    }
    // Example usage of the rule implementation
    const apiEndpoint = "https://example-api.com/data";
    ruleImplementation(apiEndpoint);

在此範例中，fetchDataFromAPI使用setTimeout模擬非同步API呼叫。 擷取資料後，它會叫用提供的回呼函式，這是處理後續規則應用程式的關閉。 ruleImplementation函式包含規則邏輯。

建議使用XSD表單資料模型建立調適型表單，即便在可能的情況下將XFA轉換為調適型表單時也是如此。

僅包含最適化表單中從使用者擷取資訊的欄位和面板。 請考慮將靜態內容維持在最小值，或使用URL在個別視窗中開啟。

雖然每個表單都是為特定目的而設計，但在大多數表單中都有一些常見的區段。 例如，個人詳細資料、地址、僱用詳細資料等。 為通用表單元素和區段建立最適化表單片段，並在各個表單中使用它們。 您也可以將現有表單中的面板儲存為片段。 片段中的任何變更會反映在所有關聯的調適型表單中。 它促進了合作創作，因為多位作者可以同時處理構成表單的不同片段。

• 與調適型表單類似，建議使用片段容器對話方塊，在使用者端資料庫中定義所有片段特定的樣式和自訂指令碼。 此外，請嘗試建立不依賴外部物件的自給自足片段。
• 避免使用跨片段指令碼。 如果片段外有任何您必須參照的物件，請嘗試將該物件設為父表單的一部分。 如果物件仍必須位於另一個片段中，請在指令碼中依其名稱參照。

使用自動儲存並恢復以定期儲存最適化表單，並讓使用者稍後重新造訪以完成表單。

設定片段以緩慢載入。 在執行階段，只有在需要標籤為延遲載入的片段時，才會轉譯。 它大幅縮短大型表單的載入時間。 具有可重複面板的片段也支援此功能。 如需詳細資訊，請參閱設定延遲載入。

• 請勿在回應式格線配置或第一個面板中，設定片段上的延遲載入。
• 延遲載入的片段不支援檔案附件和條款與條件元件。
• 如果延遲載入面板中的某個值用於表單的其他部分，請將該值標示為「全域使用值」，以便在解除安裝包含面板時使用該值。
• 請考慮為應根據條件顯示或隱藏的片段寫入可見性規則。

將​ Apache Sling主要Servlet ​中每個請求​ 的 ​呼叫數的值設定為相當大的數字。 這可讓Forms伺服器允許其他呼叫。 組態顯示預設值1500。 值1500呼叫適用於其他Experience Manager元件，例如Sites和Assets。 調適型表單的預設值集為20000。 如果您在記錄中遇到too many calls錯誤或表單無法轉譯，請嘗試將值增加到較大的數字來解決問題。 如果呼叫數超過20000，表示表單很複雜，可能需要一些時間才能在瀏覽器中呈現表單。 這僅發生在首次載入表單時，之後會快取表單，而且快取表單後，對效能沒有重大影響。

AEM Forms提供預填服務，用於從預先定義的資料XML檔案讀取資料，並使用預填XML檔案中的內容預填調適型表單的欄位。

預填資料XML必須符合與調適型表單關聯的表單模型結構描述。

在預填XML中包含afBoundedData和afUnBoundedData區段，以預填最適化表單中的繫結和未繫結欄位。

針對以表單資料模型為基礎的最適化表單，AEM Forms提供立即可用的表單資料模型預填服務。 預填服務會查詢最適化表單中資料模型物件的資料來源，並在呈現表單時預填欄位值。

您也可以使用檔案、crx、服務或http通訊協定預先填寫最適化表單。

AEM Forms支援自訂預填服務，您可以OSGi服務形式插入這些服務，以預填調適型表單。

根據最適化表單所依據的表單資料模型，您可以為DoR設定範本，如下所示：

• XFA表單範本：使用關聯的XDP檔案做為DoR範本。
• XSD結構描述：使用與適用性表單使用相同XML結構描述的相關聯XFA範本。
• 無：使用自動產生的DoR。

從最適化表單編輯器的「記錄檔案」索引標籤設定頁首、頁尾、影像、顏色、字型等。

使用DoRService以程式設計方式產生記錄檔案。

從DoR排除隱藏欄位。

使用afAcceptLang要求引數檢視其他地區設定中的DoR。

針對各表單的共同元素使用最適化表單片段，並將片段本地化。 它可確保您將片段本地化一次，並反映在使用本地化片段的所有表單中。

任何修改，例如新增元件或以當地語系化表單套用指令碼，都不會自動當地語系化。 因此，您必須先完成表單，再進行當地語系化，以避免多個本地化週期。

使用afAcceptLang要求引數覆寫瀏覽器地區設定並以指定的地區設定轉譯表單。 例如，無論瀏覽器設定中指定的地區設定為何，下列URL都會強制以日文地區設定轉譯表單：

https://'[server]:[port]'/<contextPath>/<formFolder>/<formName>.html?wcmmode=disabled&afAcceptLang=ja

AEM Forms目前支援英文(en)、西班牙文(es)、法文(fr)、義大利文(it)、德文(de)、日文(ja)、葡萄牙文 — 巴西(pt-BR)、中文(zh-CN)、中文 — 台灣(zh-TW)和韓文(ko-KR)本地化內容。 不過，您可在執行階段為最適化表單新增地區設定的支援。 如需詳細資訊，請參閱支援最適化表單本地化的新地區設定。

從Felix主控台啟用JavaScript和CSS的HTML使用者端程式庫壓縮。

在AEM Dispatcher上快取/etc.clientlibs/fd的所有使用者端資料庫以及任何其他自訂使用者端資料庫，以提高您發佈表單的回應速度與安全性。 如需詳細資訊，請參閱Dispatcher。

不要快取/content/forms/af/和/content/dam/formsanddocuments/*路徑。 如需設定最適化表單快取的詳細資訊，請參閱快取最適化表單。

透過Web伺服器壓縮模組啟用HTML。 如需詳細資訊，請參閱AEM Forms伺服器的效能調整。

針對大型表單，增加每個請求設定的呼叫。 請參閱最佳化大型與複雜表單的效能。

建立錯誤處理常式🔗顯示的自訂錯誤頁面。

安全的AEM Forms伺服器。

• 使用nosamplecontent執行模式，確保生產伺服器上未部署範例內容和範例使用者。 請參閱以生產就緒模式執行AEM。

將棧積大小維持在最小8 GB。 如需其他設定，請參閱AEM Forms伺服器的效能調整。

使用服務使用者工作階段而非管理工作階段來執行服務層級工作。 如需詳細資訊，請參閱服務驗證。

儲存草稿資料：如果您使用最適化表單的草稿功能，您應該實作自訂服務提供介面(SPI)，以將草稿資料儲存在更安全的儲存空間，例如資料庫。 如需詳細資訊，請參閱將草稿與提交元件與資料庫整合的範例。

儲存提交資料：如果您使用表單入口網站提交存放區，您應該實作自訂SPI，以將提交資料儲存在資料庫中。 如需範例整合，請參閱整合草稿與提交元件與資料庫的範例。

您也可以撰寫自訂提交動作，將表單資料和附件儲存在安全的儲存空間中。 如需詳細資訊，請參閱撰寫最適化表單的自訂提交動作。

草稿ID的長度：將最適化表單儲存為草稿時，會產生草稿ID以唯一識別草稿。 草稿ID欄位長度的最小值為26個字元。 Adobe建議將草稿ID長度設定為26個或更多字元。

順暢地使用版本控制項，例如Git：

• 從內容中隔離程式碼可大幅減少內容管理期間的Git衝突，並提升妥善組織的存放庫。
• 自訂函式對於有多位貢獻者同時運作的專案而言非常有用。

技術優點：

• 自訂函式提供模組化和封裝。
• 模組可以獨立開發、測試和維護。
• 增強程式碼的可重複使用性和可維護性。

有效的開發程式：

• 模組化可讓開發人員專注於特定功能。
• 降低整個程式碼基底的複雜性，以提升開發流程的效率，進而減輕開發人員的負擔。