Vorgehensweise: Interagieren mit Dataverse-Tabellen mithilfe der Serverlogik

In diesem Leitfaden richten Sie eine Webseite und eine benutzerdefinierte Webvorlage ein, die die Serverlogik zum Lesen, Schreiben, Aktualisieren und Löschen von Datensätzen aus der Kontakttabelle verwendet.

Schritt 1: Erstellen einer Serverlogik

  1. Melden Sie sich bei Power Pages an.

  2. Wählen Sie "Website + Bearbeiten" aus.

  3. Navigieren Sie zum Arbeitsbereich einrichten , und wählen Sie dann Serverlogik (Vorschau) aus.

  4. Wählen Sie +Neue Serverlogik aus.

  5. Geben Sie den Namen für die Serverlogik ein. Dieser Name wird in der API als Ressourcenbezeichner beim Erstellen der Serverlogik-API verwendet.

    Beispiel: Dataverse-CRUD-Operationen

  6. Wählen Sie +Rollen hinzufügen , um eine entsprechende Webrolle zuzuweisen.

  7. Wählen Sie 3 Punkte (...) neben dem Namen aus, und wählen Sie "Code bearbeiten" aus.

  8. Wählen Sie "Visual Studio Code öffnen " aus, um die benutzerdefinierte Logik zu erstellen. Sie finden vordefinierte Methoden und Skripts in der Datei.

  9. Definieren Sie die Serverlogikmethode zum Lesen, Bearbeiten, Erstellen, Löschen der Kontaktdatensätze.

    Lesen: Fügen Sie das unten angegebene Skript in die get-Methode ein.

    const entitySetName = Server.Context.QueryParameters["entitySetName"];
    if (!Server.Context.QueryParameters["id"]) {
        return Server.Connector.Dataverse.RetrieveMultipleRecords(entitySetName);
    } else {
        const id = Server.Context.QueryParameters["id"]; // Context reference
        return Server.Connector.Dataverse.RetrieveRecord(entitySetName, id);
    }
    

    Erstellen: Fügen Sie das untenstehende Skript in die Post-Methode ein.

    const data = Server.Context.Body;
    const entitySetName = Server.Context.QueryParameters["entitySetName"];
    return Server.Connector.Dataverse.CreateRecord(entitySetName, data);
    

    Aktualisierung: Fügen Sie das untenstehende Skript in die Methode "put" ein.

    const id = Server.Context.QueryParameters["id"];
    const data = Server.Context.Body;
    return Server.Connector.Dataverse.UpdateRecord("accounts", id, data);
    

    Löschen: Im del-Method einfügen

    const id = Server.Context.QueryParameters["id"];
    const entitySetName = Server.Context.QueryParameters["entitySetName"];
    Server.Logger.Log("Entity Set name:" + entitySetName);
    return Server.Connector.Dataverse.DeleteRecord(entitySetName, id);
    
  10. Speichern Sie die Datei.

  11. Hier sehen Sie den vollständigen Serverlogikcode, der eingefügt werden kann.

    function get() {
     try {
         Server.Logger.Log("GET called"); // Logger reference
         const entitySetName = Server.Context.QueryParameters["entitySetName"];
         const additionParameters = Server.Context.QueryParameters['additionalParameters'];
         if (!Server.Context.QueryParameters["id"]) {
             const response = Server.Connector.Dataverse.RetrieveMultipleRecords(entitySetName,additionParameters);
             return response;
         }
         else{            
             const id = Server.Context.QueryParameters["id"]; // Context reference
             const response = Server.Connector.Dataverse.RetrieveRecord(entitySetName, id,additionParameters);
             return response;
         }        
     } catch (err) {
         Server.Logger.Error("GET failed: " + err.message);
         return JSON.stringify({ status: "error", method: "GET", message: err.message });
     }
     }
     function post() {
     try {
         Server.Logger.Log("POST called");
         const data = Server.Context.Body;
         const entitySetName = Server.Context.QueryParameters["entitySetName"];
          return Server.Connector.Dataverse.CreateRecord(entitySetName, data);
      } catch (err) {
         Server.Logger.Error("POST failed: " + err.message);
         return JSON.stringify({ status: "error", method: "POST", message: err.message });
     }
     } 
     function put() {
     try {
         Server.Logger.Log("PUT called");
         const id = Server.Context.QueryParameters["id"];
         const data = Server.Context.Body;
         const entitySetName = Server.Context.QueryParameters["entitySetName"];
         return Server.Connector.Dataverse.UpdateRecord(entitySetName, id, data);
      } catch (err) {
         Server.Logger.Error("PUT failed: " + err.message);
         return JSON.stringify({ status: "error", method: "PUT", message: err.message });
     }
     }   
     function del() {
     try {
         // "delete" keyword should not be used in script file.
         Server.Logger.Log("DEL called");
         const id = Server.Context.QueryParameters["id"];
           const entitySetName = Server.Context.QueryParameters["entitySetName"];
         return Server.Connector.Dataverse.DeleteRecord(entitySetName, id);
      } catch (err) {
         Server.Logger.Error("Deletion failed: " + err.message);
         return JSON.stringify({ status: "error", method: "DEL", message: err.message });
     }
     }
    

Schritt 2: Erstellen einer Webseite

  1. Starten Sie das Power Pages-Designstudio.

  2. Wählen Sie im Arbeitsbereich Seiten+ Seite aus.

  3. Geben Sie im Dialogfeld " Seite hinzufügen " die Serverlogik in das Feld "Name " ein, und wählen Sie "Start" im leeren Layout aus .

  4. Wählen Sie Hinzufügen aus.

  5. Wählen Sie die Option "Code bearbeiten" in der oberen rechten Ecke aus.

  6. Wählen Sie "Visual Studio Code öffnen" aus.

  7. Kopieren Sie den folgenden Codeausschnitt, und fügen Sie ihn zwischen den <div></div> Tags des Seitenabschnitts ein.

    <style>
    #processingMsg {
        padding: 6px 12px; background: #eee; border-radius: 4px;
        position: fixed; top: 10px; left: 50%; transform: translateX(-50%);
        display: none; z-index: 9999; text-align: center; font-weight: bold;
    }
    table { border-collapse: collapse; width: 100%; margin-top: 10px; font-family: Arial, sans-serif; }
    th, td { border: 1px solid #ccc; padding: 6px; text-align: left; }
    button { cursor: pointer; border: 1px solid #aaa; padding: 4px 8px; border-radius: 4px; background: #fff; font-size: 14px; margin-right: 2px; }
    button.add { color: green; }
    button.save { color: green; }
    button.cancel { color: orange; }
    button.delete { color: red; }
    input { width: 95%; box-sizing: border-box; }
    td.actions { white-space: nowrap; }
    </style>
    
    <div id="processingMsg">Processing...</div>
    <div id="dataTable"></div>
    
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
    $(function() {
        // --- safeAjax wrapper ---
        (function(webapi, $) {
            function safeAjax(ajaxOptions) {
                var dfd = $.Deferred();
                shell.getTokenDeferred().done(function(token) {
                    ajaxOptions.headers = ajaxOptions.headers || {};
                    ajaxOptions.headers["__RequestVerificationToken"] = token;
                    $.ajax(ajaxOptions)
                        .done((data, ts, jq) => validateLoginSession(data, ts, jq, dfd.resolve))
                        .fail(dfd.reject);
                }).fail(() => dfd.rejectWith(this, arguments));
                return dfd.promise();
            }
            webapi.safeAjax = safeAjax;
        })(window.webapi = window.webapi || {}, jQuery);
    
        // --- notification banner ---
        const notify = (function() {
            const $m = $('#processingMsg'); let s = 0, t;
            return {
                show: (msg = 'Processing...') => { $m.text(msg); if (!s) clearTimeout(t), $m.show(); s++; },
                hide: () => { s = Math.max(0, s - 1); if (!s) clearTimeout(t), t = setTimeout(() => $m.hide(), 300); }
            };
        })();
    
        function ajaxCall(msg, opts) {
            notify.show(msg);
            return webapi.safeAjax(opts)
                .fail(r => alert(r.responseJSON?.error?.message || 'Server logic not available'))
                .always(notify.hide);
        }
    
        // --- Table config ---
        const cols = [
            { name: 'firstname', label: 'First Name' },
            { name: 'lastname', label: 'Last Name' },
            { name: 'emailaddress1', label: 'Email' },
            { name: 'telephone1', label: 'Telephone' }
        ];
        let data = [];
    
        function render() {
            const html = `<table>
                <thead>
                    <tr>
                        ${cols.map(c => `<th>${c.label}</th>`).join('')}
                        <th>Actions <button class="add">➕</button></th>
                    </tr>
                </thead>
                <tbody>
                    ${data.map(r => `<tr data-id="${r.id}" data-name="${r.fullname}">
                        ${cols.map(c => `<td data-attribute="${c.name}" data-value="${r[c.name] || ''}">${r[c.name] || ''}</td>`).join('')}
                        <td class="actions">
                            <button class="delete">🗑️</button>
                        </td>
                    </tr>`).join('')}
                </tbody>
            </table>`;
            $('#dataTable').html(html);
        }
    
        function addRecord(r) { data.unshift(r); render(); }
        function removeRecord(id) { data = data.filter(r => r.id !== id); render(); }
        function updateRecord(id, attr, val) { const r = data.find(r => r.id === id); if (r) { r[attr] = val; render(); } }
    
        // --- Events ---
        $('#dataTable').on('dblclick', 'tr', function() {
            const $tr = $(this);
            if ($tr.hasClass('editing')) return; // prevent double edit
            $tr.addClass('editing');
            $tr.data('original', $tr.find('td[data-attribute]').map(function() { return $(this).text(); }).get());
            $tr.find('td[data-attribute]').each(function() {
                const $td = $(this);
                const oldVal = $td.text();
                $td.html(`<input type="text" value="${oldVal}" data-attr="${$td.data('attribute')}" />`);
            });
            const $actions = $tr.find('td.actions');
            $actions.append('<button class="save">✅</button><button class="cancel">❌</button>');
        });
    
        $('#dataTable').on('click', '.save', function() {
            const $tr = $(this).closest('tr');
            const id = $tr.data('id');
            const updates = {};
            $tr.find('input').each(function() {
                updates[$(this).data('attr')] = $(this).val();
            });
            ajaxCall('Updating...', {
                type: 'PUT',
                url: `/_api/serverlogics/dataverse-crud-operations?entitySetName=contacts&id=${id}`,
                contentType: 'application/json',
                data: JSON.stringify(updates),
                success: () => { Object.assign(data.find(r => r.id === id), updates); render(); }
            });
        });
    
        $('#dataTable').on('click', '.cancel', function() {
            const $tr = $(this).closest('tr');
            const original = $tr.data('original');
            $tr.find('td[data-attribute]').each(function(i) {
                $(this).text(original[i]);
            });
            $tr.removeClass('editing');
            $tr.find('button.save, button.cancel').remove();
        });
    
        $('#dataTable').on('click', '.delete', function() {
            const $tr = $(this).closest('tr');
            if (confirm('Delete "' + $tr.data('name') + '"?')) {
                ajaxCall('Deleting...', {
                    type: 'DELETE',
                    url: `/_api/serverlogics/dataverse-crud-operations?entitySetName=contacts&id=${$tr.data('id')}`,
                    contentType: 'application/json',
                    success: () => removeRecord($tr.data('id'))
                });
            }
        });
    
        $('#dataTable').on('click', '.add', function() {
            const r = { firstname: 'Alton', lastname: 'Stott' + Math.floor(Math.random() * 900 + 100), emailaddress1: 'Alton.Stott@contoso.com', telephone1: '555-123-4567' };
            ajaxCall('Adding...', {
                type: 'POST',
                url: '/_api/serverlogics/dataverse-crud-operations?entitySetName=contacts',
                contentType: 'application/json',
                data: JSON.stringify(r),
                success: (res, s, xhr) => { r.id = xhr.getResponseHeader('entityid'); r.fullname = r.firstname + ' ' + r.lastname; addRecord(r); }
            });
        });
    
        ajaxCall('Loading...', {
            type: 'GET',
            url: '/_api/serverlogics/dataverse-crud-operations?entitySetName=contacts&additionalParameters=$select=fullname,firstname,lastname,emailaddress1,telephone1',
            contentType: 'application/json'
        }).done(res => {
            try {
                const p = JSON.parse(res.data); const b = JSON.parse(p.Body);
                data = (b.value || []).map(r => ({ ...r, id: r.contactid, fullname: r.fullname }));
                render();
            } catch (e) { console.error(e); }
        });
    });
    </script>
    

Schritt 3: Konfigurieren von Berechtigungen

Erstellen einer Webrolle

Wenn Sie derzeit keine Webrolle mit Berechtigungen für die Tabelle besitzen, auf die Sie über die Serverlogik zugreifen oder einen anderen Kontext für den Zugriff auf die Daten benötigen, zeigen die folgenden Schritte, wie Sie eine neue Webrolle erstellen und Tabellenberechtigungen zuweisen.

  1. Starten Sie die Portalverwaltungs-App.
  2. Wählen Sie im linken Bereich im Abschnitt "Sicherheit" die Option "Webrollen" aus.
  3. Wählen Sie "Neu" aus.
  4. Geben Sie im Feld "Name " den Serverlogikbenutzer (oder einen beliebigen Namen ein, der die Rolle des Benutzers widerspiegelt, der auf diese Funktionalität zugreift).
  5. Wählen Sie in der Website-Liste Ihren Websitedatensatz aus.
  6. Wählen Sie Speichern aus.

Erstellen von Tabellenberechtigungen

  1. Starten Sie das Power Pages-Designstudio.
  2. Wählen Sie den Arbeitsbereich "Sicherheit" aus.
  3. Wählen Sie im Abschnitt Schützen die Option Tabellenberechtigungen aus.
  4. Wählen Sie "Neue Berechtigung" aus.
  5. Geben Sie im Feld "Name " die Berechtigung "Kontakttabelle" ein.
  6. Wählen Sie in der Tabellenname-ListeKontakt (contact) aus.
  7. Wählen Sie in der Access-Typliste"Global" aus.
  8. Wählen Sie die Berechtigungen "Lesen", "Schreiben", " Erstellen" und " Löschen " aus.
  9. Wählen Sie +Rollen hinzufügen und die Webrolle aus, die Sie zuvor ausgewählt oder erstellt haben.
  10. Wählen Sie "Speichern" und "Schließen" aus.

Hinzufügen von Kontakten zur Webrolle

  1. Starten Sie die Portalverwaltungs-App.
  2. Wählen Sie im linken Bereich im Abschnitt "Sicherheit " die Option "Kontakte" aus.
  3. Wählen Sie einen Kontakt aus, den Sie in diesem Beispiel für die Serverlogik verwenden möchten.

    Hinweis

    Dieser Kontakt ist das Benutzerkonto, das in diesem Beispiel zum Testen der Serverlogik verwendet wird. Achten Sie darauf, den richtigen Kontakt in Ihrem Portal auszuwählen.

  4. Wählen Sie verwandte>Webrollen aus.
  5. Wählen Sie "Vorhandene Webrolle hinzufügen" aus.
  6. Wählen Sie die Serverlogik-Benutzerrolle aus, die zuvor erstellt wurde.
  7. Wählen Sie Hinzufügen aus.
  8. Wählen Sie "Speichern" und "Schließen" aus.

Schritt 4: Verwenden der Serverlogik zum Lesen, Anzeigen, Bearbeiten, Erstellen und Löschen

So testen Sie die Web-API-Funktionalität:

  1. Wählen Sie "Vorschau" und dann "Desktop" aus.
  2. Melden Sie sich bei Ihrer Website mit dem Benutzerkonto an, dem die zuvor erstellte Serverlogikbenutzerrolle zugewiesen wurde.
  3. Wechseln Sie zur zuvor erstellten Serverlogikwebseite .

Übersicht über Die Serverlogik
Autorenserverlogik
Serverobjekte