Übung – Ein Zahlungsformular in Power Pages erstellen und testen
Bei der Integration von Zahlungsmethoden in Power Pages benötigen Sie ein Formular und eine zugehörige Tabelle für die Verbindung mit den Daten. Für diese Übung erstellen Sie eine neue Tabelle und ein neues Formular, um eine Vorstellung davon zu erhalten, was Sie bei der Integration von Zahlungsmethoden benötigen. Wenn Sie bereits über Tabellen und Formulare für diesen Zweck verfügen, können Sie diese verwenden und dann mit der Erstellung des mehrstufigen Formulars fortfahren.
Eine Zahlungskontakttabelle erstellen
Bevor Sie Tabellen und Formulare erstellen, empfiehlt es sich, diese Ressourcen in eine Lösung einzubauen. Eine Lösung ist ein Paket, mit dem Sie Anpassungen, Anwendungen, Komponenten und Konfigurationen zwischen Umgebungen gruppieren, verwalten und transportieren können.
Wechseln Sie zu Power Pages, und melden Sie sich beim Mandanten an, mit dem Sie Ihre Stripe-Integrationen verbunden haben.
Wählen Sie im linken Navigationsmenü Lösungen und dann im oberen Menü + Neue Lösung aus.
Nennen Sie die Lösung Testzahlungen (oder ähnlich), und verwenden Sie dann den Standardherausgeber, wenn kein Herausgeber zugewiesen ist.
Wählen Sie in der Lösung Testzahlungen die Option + Neu aus dem Tabellenmenü aus, und klicken Sie dann auf Tabelle > Tabelle (erweiterte Eigenschaften).
Es öffnet sich rechts ein Bereich Neue Tabelle. Geben Sie der Tabelle den Namen Payment contact, belassen Sie die primäre Spalte als Name, und wählen Sie dann die Option Speichern aus.
Nach dem Wechsel zur Tabelle Payment contact klicken Sie im oberen Menü auf + Neu. Klicken Sie dann auf Spalte.
Geben Sie er Spalte den Namen Payment amount, und wählen Sie Währung als Datentyp aus. Klicken Sie dann auf Speichern.
Wichtig
Wenn Sie die Stripe-Integration in einem mehrstufigen Formular verwenden, benötigen Sie eine Währungsspalte. Diese Spalte bestimmt, welcher Betrag dem Benutzer in Rechnung gestellt werden soll. Die Integration funktioniert nicht, wenn Sie keine Währungsspalte haben.
Fügen Sie eine weitere Spalte mit dem Namen E-Mail. Diese verfolgt die E-Mail-Adresse des Benutzers nach. Verwenden Sie den Datentyp Einzelne Textzeile mit dem Format E-Mail.
Sie sollten jetzt über eine Tabelle mit den Zahlungskontakten verfügen, die Sie verwenden können. Im nächsten Abschnitt erstellen Sie das Formular, das mit dieser Tabelle verknüpft ist. Dann fügen Sie es einem mehrstufigen Formular auf Ihrer Power Pages-Website hinzu.
Das Formular der Tabelle anpassen
Wenn Sie die Zahlungskontakttabelle mit dem mehrstufigen Formular auf Ihrer Website verknüpfen, müssen Sie ein Formular auswählen, das mit der Zahlungskontakttabelle verknüpft ist. Das Standardformular, das neuen Tabellen zugeordnet ist, enthält möglicherweise nicht alle Informationen, die Benutzer ausfüllen sollen. Sie müssen dem vorhandenen Hauptinformationsformular Spalten hinzufügen, um dieses Problem zu beheben.
Wählen Sie über die Zahlungskontakttabelle die Option Formulare unter Datenerfahrungen aus.
Wählen Sie auf der Seite Formulare das Formular Information mit dem Formulartyp Haupt aus, und klicken Sie dann im oberen Menü auf die Option Bearbeiten.
Fügen Sie im Formulareditor Neuer Zahlungskontakt die folgenden Spalten aus dem Bereich Tabellenspalten links hinzu, indem Sie ihren Namen aus der Liste auswählen:
- Zahlungsbetrag
Hinweis
Achten Sie bei der Auswahl eines Zahlungsbetrags darauf, dass Sie die Zahlungsbetragsspalte WITHOUT (Basis) verwenden. Das Ausblenden des Besitzers kann optional auch die Lesbarkeit Ihres Formulars verbessern.
Wählen Sie oben rechts im Formulareditor die Option Speichern und veröffentlichen aus.
Sie sollten nun eine Tabelle und ein Formular eingerichtet haben, damit Personen Zahlungen vornehmen können. Im nächsten Abschnitt integrieren Sie auf Ihrer Power Pages-Website diese Ressourcen in ein mehrstufiges Formular.
Komponente für mehrstufiges Formular erstellen
Obwohl Formulare auch direkt mit Tabellen verknüpft sind, können Sie benutzerdefinierte Formulare im Power Pages-Designstudio erstellen. In den folgenden Abschnitten erfahren Sie, wie Sie ein mehrstufiges Formular erstellen und in Stripe integrieren.
Beginnen Sie damit, Ihre Power Pages-Website von der Power Pages-Homepage aus zu bearbeiten, um zum Designstudio zu wechseln.
Wechseln Sie zu der Seite, auf der Sie das Formular verwenden möchten, oder wählen Sie die Option + Seite aus, um eine leere Seite hinzuzufügen.
Wählen Sie im Bereich + Einen Abschnitt hinzufügen ihrer Seite die Option Mehrstufiges Formular unter dem Menü Eine Komponente auswählen aus, um ein neues mehrstufiges Formular zu erstellen.
Wenn ein Fenster Mehrstufiges Formular hinzufügen geöffnet wird, wählen Sie die Option + Neues mehrstufiges Formular aus.
Benennen Sie das Formular ähnlich wie Zahlung, und wählen Sie dann Fertig aus, um das Formular zu erstellen.
Wählen Sie im erstellten Formularbereich die Option + Ersten Schritt hinzufügen aus, um den ersten Schritt Ihres Formulars hinzuzufügen.
Geben Sie im Fenster Schritt hinzufügen, das geöffnet wird, dem Schritt den Namen Collect information, und wählen Sie dann die Tabelle Payment contact aus, die Sie zuvor erstellt haben. Wählen Sie unter Formular auswählen die Option Information und dann OK aus.
Hinweis
Das Formular Informationen ist das gleiche Hauptformular, das sie zuvor bearbeitet haben mit den ausgewählten Feldern Name, E-Mail und Zahlungsbetrag. Wenn Sie das Feld Besitzer ausgeblendet haben, sollte es nicht im mehrstufigen Formular angezeigt werden.
Wählen Sie + Schritt hinzufügen im oberen Bereich des Formulars aus.
Geben Sie dem Schritt den Namen Payment im Fenster Schritt hinzufügen, das geöffnet wird. Wählen Sie die gleiche Tabelle Payment contact und das Formular Information aus, dass Sie im vorherigen Schritt verwendet haben, und klicken Sie auf OK.
Wählen Sie die Option Schritteinstellungen aus, während Sie auf Schritt 2/2 warten.
Wechseln Sie zu App-Integrationen vom linken Navigationsfenster, und wählen Sie den Umschalter neben Digitale Zahlungen aktivieren aus, um die Stripe-Integration zu aktivieren. Wählen Sie für das Feld Betrag auswählen die Option Zahlungsbetrag und dann OK aus, um das Formular abzuschließen.
Sie sollten jetzt ein vollständiges mehrstufiges Formular haben, bei dem in einem Schritt Benutzereingaben für Name, E-Mail und Zahlungsbetrag erforderlich sind und im nächsten Schritt die bereitgestellten Benutzereingaben und ein angefügtes Zahlungsformular angezeigt werden. Der Preisbetrag sollte ebenfalls an das Feld Zahlungsbetrag gebunden sein.
Damit Benutzer das Formular anzeigen und Sie es testen können, müssen Sie die Berechtigungen des Formulars anpassen. Wählen Sie dazu + Neue Berechtigung im oberen Teil des Formulars aus.
Stellen Sie sicher, dass die folgenden Felder im sich rechts öffnenden Bereich Neue Tabellenberechtigung automatisch ausgefüllt werden:
- Tabelle – Payment contact
- Zugriffstyp – Global Access
-
Berechtigung für
- Lesen
- Erstellen
Wählen Sie im unteren Teil des Bereichs Neue Tabellenberechtigung die Option + Rollen hinzufügen aus. Wählen Sie die Rollen Administratoren und Authentifizierte Benutzer und dann die Option Speichern aus.
Wählen Sie Synchronisieren rechts oben im Designstudio aus, und klicken Sie dann auf Vorschau > Desktop, um eine Vorschau der Seite anzuzeigen.
Wenn Sie das Formular in der Vorschau anzeigen, wird je nach Ihrer Webseite-Einrichtung möglicherweise die Nachricht Sie verfügen nicht über die entsprechenden Berechtigungen. Sie müssen sich bei der Website anmelden, um das Formular anzuzeigen.
Schließen Sie die folgenden Schritte ab, wenn Ihre Website eine der Power Pages-Vorlagen verwendet:
Wählen Sie Anmelden oben rechts auf der Website aus.
Wählen Sie Microsoft Entra ID unter Mit externem Konto anmelden aus. Melden Sie sich bei Ihrem Mandanten an, und akzeptieren Sie die Berechtigungsanfrage.
Wenn Sie sich noch nicht auf Ihrer Website angemeldet haben, geben Sie Ihre Daten ein, und wählen Sie Speichern aus. Wechseln Sie dann zu Ihrem Zahlungsformular zurück.
Ihr Formular sollte jetzt sichtbar sein und dem folgenden Screenshot ähneln.
Im nächsten Abschnitt werden Ihre Testoptionen mit dem Stripe-Formular behandelt, einschließlich Testkartennummern, die Sie verwenden können.
Das Formular testen
Wenn Sie Stripe-Zahlungen auf Ihrer Power Pages-Website testen, stellt Ihnen Stripe eine Reihe von Testkarten bereit, die Sie verwenden können. Die Liste stellt zudem die mit der Kartenmarke verbunden IDs PaymentMethod und Token bereit. Unter Testkarten finden Sie die vollständige Liste.
Die Testmethode ist einfach und erfordert nur, dass Sie eine Karte aus der Liste auswählen und dann das Formular Ihrer Website ausfüllen, ähnlich wie Sie eine normale Zahlung vornehmen würden.
Wechseln Sie über die Vorschaufunktion des Designstudios zu Ihrem Zahlungsformular, und geben Sie dann die Informationen in die Felder Name und E-Mail ein, an die Sie sich erinnern. Stellen Sie sicher, dass Sie sich im Schritt Informationen sammeln des Formulars befinden.
Hinweis
Die von Ihnen eingegebenen Informationen dienen nur zu Testzwecken. Es muss sich nicht um einen echten Namen handeln, der mit einer echten E-Mail-Adresse verknüpft ist
Geben Sie für den Zahlungsbetrag eine Nummer ein, und klicken Sie dann auf Weiter.
Hinweis
Die Grenzwerte dieser Zahl hängen von den Einstellungen der einzelnen Spalten ab. Beim Einrichten einer Währungsspalte haben Sie die Möglichkeit, die Wertgrenzen zu ändern. Sie können auch die Art der Währung festlegen.
Das System leitet zum Zahlungsschritt des Formulars weiter, nachdem Sie „Weiter“ ausgewählt haben. In diesem Schritt geben Sie eine Testkartennummer aus der Stripe-Dokumentation ein.
Wählen Sie Karte aus, und geben Sie dann eine der Testkarten ein. Klicken Sie im unteren Bereich des Formulars auf Jetzt bezahlen, um den Prozess abzuschließen. Das Ablaufdatum kann ein beliebiges zukünftiges Datum sein, der Sicherheitscode kann drei beliebige Ziffern und die Postleitzahl fünf beliebige Ziffern haben.
Hinweis
Die Informationen, die Sie im Schritt Informationen sammeln angegeben haben, sollten nun im oberen Teil des Schritts Zahlung angezeigt werden, jedoch im Modus Schreibgeschützt.
Nachdem Sie die Zahlung bestätigt haben, werden Sie zu einer Übersichtsseite geleitet, auf der Name, die E-Mail-Adresse, der Zahlungsbetrag und die Transaktions-ID der Transaktion angezeigt werden.
Sie können die Datensätze in Ihrer Tabelle Payment contact überprüfen, um zu bestätigen, dass die Zahlung intern erfolgreich war.
Wechseln Sie zur Seite Transaktionen, um Stripe zu bestätigen. Hier sollte Ihre Transaktion als Erfolgreich angezeigt werden mit der Transaktions-ID unter Beschreibung.
Nächste Schritte
Nachdem Sie nun Übung in der Entwicklung und Erprobung eines Zahlungsformulars gesammelt haben, sollten Sie in der Lage sein, dieses Wissen mit Ihrem eigenen Unternehmen oder Ihren persönlichen Daten und Anwendungsfällen zu integrieren.
Wenn Sie von Test‑ zu Live-Schlüsseln wechseln, ist es wichtig zu wissen, dass Sie zum Speichern Ihrer API-Schlüssel den Azure Key Vault verwenden müssen. Dataverse-Speicher wird nicht für Zahlungsintegrationen mit Live-Schlüsseln akzeptiert. Führen Sie diese Schritte aus, wenn Sie Ihre Schlüssel dem Azure Key Vault hinzufügen:
Rufen Sie den Namen Ihrer App von der Seite App-Registrierungen in Azure ab. Der Name der App im Azure-Portal ist der Name Ihrer Website mit einem Portal-Präfix. Wenn der Name ihrer Website Contoso Coffee ist, dann wäre der App-Name im Azure-Portal Portals-Contoso Coffee.
Wechseln Sie im Azure-Portal zu Key Vaults, und erstellen Sie einen neuen Key Vault, oder nutzen Sie einen vorhandenen.
Sie müssen Beim Erstellen eines neuen Key Vault ein Berechtigungsmodell auswählen. Sie können Rollenbasierte Zugriffssteuerung für Azure oder eine Key Vault-Zugriffsrichtlinie auswählen.
Fügen Sie Ihren eingeschränkten Stripe-Schlüssel als Geheimnis zum Schlüsseltresor hinzu. Weitere Informationen zum Erstellen eines Geheimnisses in Azure Key Vault finden Sie unter Ein Geheimnis aus Azure Key Vault mithilfe des Azure-Portals einrichten und abrufen.