Formulare
AEM bietet einen Formularservice, der gesendete Daten in ein Microsoft Excel- oder Google Sheets-Dokument aufnimmt.
Daten, die über Formulare auf Ihrer Website übermittelt werden, fließen direkt in Tabellen ein, wodurch sie für Geschäftsbenutzer leicht zugänglich sind. Solche Daten können auch mit komplexeren automatisierten Workflows interagieren, da sowohl Google Sheets als auch Microsoft Excel und SharePoint Zugriff auf ein lebendiges Ökosystem und robuste APIs bieten.
Vorbereiten eines Blatts für die Datenaufnahme
-
Erstellen Sie eine Excel-Arbeitsmappe oder ein Google-Blatt an einer beliebigen Stelle in Ihrem Projektverzeichnis. Dieses Dokument verwendet ein Blatt in OneDrive namens
email-form.xlsx
im Stammverzeichnis eines AEM-Projekts. -
Stellen Sie sicher, dass der AEM-Benutzer (z. B. helix@adobe.com), die für Ihr Projekt konfiguriert wurde, hat Berechtigung bearbeiten auf dem Blatt.
-
Öffnen Sie die erstellte Arbeitsmappe und benennen Sie das Standardblatt in um.
incoming
.
Hinweis: AEM sendet keine Daten an diese Arbeitsmappe, wennincoming
Blatt existiert nicht. -
Zeigen Sie eine Vorschau des Blattes im Sidekick an.
Hinweis: Selbst wenn ein Blatt zuvor in der Vorschau angezeigt wurde, muss es nach dem Erstellen des Formulars erneut in der Vorschau angezeigt werdenincoming
Blatt zum ersten Mal. -
Richten Sie das Blatt mit den Kopfzeilen ein, die den aufgenommenen Daten entsprechen. Sie können dies entweder manuell tun oder indem Sie eine POST-Anfrage an die Formularroute im AEM Admin Service senden. Der Admin-Service untersucht die Daten im Hauptteil der POST und erstellt die erforderlichen Kopfzeilen/Tabellen und Blätter, die erforderlich sind, um Daten aufzunehmen und den Forms-Service optimal zu nutzen.
Einzelheiten zum Format der POST-Anforderung zum Einrichten des Blatts finden Sie in der Admin-API Dokumentation sowie das folgende Beispiel:
Anfrage:code language-none POST /form/{owner}/{repo}/{ref}/en/email-form.json HTTP/1.1 {"data":{"firstName":"test"}}
Antwort:
code language-none HTTP/1.1 200 OK {"rowCount":2,"columns":["firstName"]}
Sie können ein Tool wie curl oder Postman verwenden, um diese POST-Anfrage zu stellen. Zum Beispiel:
code language-none curl -s -i -X POST 'https://admin.hlx.page/form/{owner}/{repo}/{ref}/en/email-form.json' \ --header 'Content-Type: application/json' \ --data '{"data":{"firstName":"test"}}'
Durch die obige Anfrage zur POST stellen wir Beispieldaten bereit, d. h. die Formularfelder und Beispielwerte, die vom Admin-Service für die Einrichtung des Formulars verwendet werden.
Der Admin-Service wird empfohlen, Ihr Blatt einzurichten. Wenn Sie die Kopfzeilen jedoch manuell erstellen möchten, lesen Sie bitte das Dokument . Manuelle Forms Sheet-Einrichtung. -
Nach dem Versand von
POST
Um den Admin-Service anzufordern, werden die folgenden Änderungen an Ihrer Arbeitsmappe angezeigt.-
Ein Blatt mit dem Namen
helix-default
wird erstellt. Die Daten in diesem Blatt werden zurückgegeben, wenn einGET
Anforderung wird an das Blatt gesendet. Dies ist ein hervorragender Ort, um Tabellenformeln zu verwenden, um die Daten aus demincoming
Blatt für den Verbrauch anderswo.
Hinweis: Diehelix-default
Das Blatt sollte niemals persönlich identifizierbare Informationen oder andere Daten enthalten, wenn Sie mit der öffentlichen Zugänglichkeit nicht einverstanden sind. -
Ein Blatt mit dem Namen
slack
wurde erstellt. Hier können Sie automatische Benachrichtigungen für einen Slack-Kanal einrichten, wenn Daten in Ihre Tabelle aufgenommen werden. Derzeit unterstützt AEM nur Benachrichtigungen an die AEM Engineering Slack-Organisation sowie die Adobe Enterprise Support-Organisation.- Um Slack-Benachrichtigungen einzurichten, geben Sie Folgendes ein:
teamId
des Arbeitsbereichs Slack und derchannel
Name oder ID. Sie können auch den Slack-Bot fragen (mit demdebug
Befehl) für dieteamId
und diechannel
ID. Verwenden deschannel
Die ID anstelle des Namens ist vorzuziehen, da sie die Kanalumbenennungen übersteht.
Hinweis: Ältere Formulare hatten nicht dieteamId
Spalte. DieteamId
war in derchannel
Spalte, durch ein#
oder/
. - Eingeben beliebiger Werte Anrede Sie möchten und unter Felder Geben Sie die Namen der Felder ein, die in der Slack-Benachrichtigung angezeigt werden sollen. Jede Überschrift sollte durch ein Komma (z. B.
name, email
).
- Um Slack-Benachrichtigungen einzurichten, geben Sie Folgendes ein:
-
Senden von Daten an Ihr Blatt
Das Blatt ist jetzt zur Datenaufnahme bereit und Sie können Folgendes senden POST
Anfragen direkt an das Blatt am hlx.page
, hlx.live
oder Ihre Produktions-Domain.
POST https://ref–repo–owner.hlx.(page|live)/email-form
POST https://my-domain.com/email-form
Hinweis: Die URL sollte Folgendes nicht enthalten .json
Erweiterung. Das Blatt muss veröffentlicht werden für POST
Vorgänge, an denen gearbeitet werden soll .live
oder auf der Produktions-Domain.
Es gibt einige verschiedene Möglichkeiten, die Formulardaten im Formular zu formatieren POST
Textkörper.
- Als Array von Name/Wert-Paaren
https://gist.github.com/dylandepass/9ba6b83700dfce1fa90a47bde62c2e9 - Als Objekt mit Schlüssel/Wert-Paaren
<script src=“https://gist.github.com/dylandepass/2b5f694723dfdb3d304fcafc613d6595.js”></script> - Als
x-www-form-urlencoded
Textkörper (content-type
-Kopfzeile muss auf gesetzt seinapplication/x-www-form-urlencoded
)
<script src=“https://gist.github.com/dylandepass/b72b2e30313bc80beb02e12b1d7201ff.js”></script>
Das war's! Der Forms-Service wird jede Minute ausgeführt, damit Sie Ihre in das Blatt aufgenommenen Daten schnell sehen können.
Author-created Forms
In vielen Fällen ist es wünschenswert, dass Autoren Formulare erstellen und entscheiden, welche Formularfelder dem Besucher Ihrer Website präsentiert werden sollen. Es ist üblich, die Variable helix-default
Blatt in derselben Tabelle, die für die Übermittlung des Formulars verwendet wird, als Ort, an dem der Autor seine Formulare definieren kann.
Normalerweise gibt es einen Formularblock, der einen Verweis auf die Tabelle nimmt, das Formular rendert und den Benutzerfluss durch die Übermittlung verarbeitet.
Ein einfaches Beispiel für ein solches form
Block kann gefunden werden hier und der Adaptive Forms-Block verfügbar ist hier.
Wenn Sie Formulare mit Funktionen wie reCAPTCHA, Barrierefreiheit, Datei-Uploads, Feldvalidierungen, E-Signierung, Leistungsüberwachung, tabellenbasierte Regeln, Datensatzdokument (DoR) und mehr benötigen, verwenden Sie das 🔗 Adaptiver Forms-Block. Es unterstützt eine breite Palette von Formularen, von einfachen Formularen zur Erfassung grundlegender Informationen (wie Kontaktformulare oder Service-Anfragen) bis hin zu komplexen Formularen mit mehreren Abschnitten, Regeln und Integrationen mit Adobe Sign, Adobe Workfront und externen Systemen. Sie können damit sogar Daten an Tabellen senden oder eine Verbindung zu externen Systemen für Formulare auf Unternehmensebene herstellen. Weitere Informationen finden Sie unter 🔗 Dokumentation zu AEM Forms Edge Delivery Services.
Sehen Sie sich das folgende Beispiel an, wie die Tabelle für die Formulardefinition aussehen könnte.
Die unterstützten Formularfelder sind erweiterbar und die form
sollte als Beispiel angesehen werden, das Ihnen einen Ausgangspunkt bietet.
Als Beispiel wurde dieser Seite ein voll funktionsfähiges Formular hinzugefügt, indem die zuvor aufgeführte Code-Basis verwendet wurde, indem einfach der folgende Block im Google-Dokument hinzugefügt wurde:
Sie können es ausprobieren und sehen, wie die Formulardaten in die Eingangsbogen. Es kann eine Minute dauern, vom Formular-Service zur Tabelle zu gelangen.