Guide pratique pour interagir avec des tables Dataverse à l’aide de la logique serveur

Dans ce guide, vous allez configurer une page web et un modèle web personnalisé qui utilisera la logique du serveur pour lire, écrire, mettre à jour et supprimer des enregistrements de la table de contacts.

Étape 1 : Créer une logique de serveur

Connectez-vous à Power Pages.
Sélectionnez site + Modifier.
Accédez à l’espace de travail Configurer , puis sélectionnez Logique du serveur (préversion).
Sélectionnez +Nouvelle logique de serveur.
Entrez le nom de la logique du serveur. Ce nom est utilisé dans l’API comme identificateur de ressource lors de la construction de l’API logique du serveur.

Exemple : dataverse-crud-operations
Sélectionnez +Ajouter des rôles pour attribuer un rôle web approprié.
Sélectionnez 3 points (...) en regard du nom et sélectionnez Modifier le code.
Sélectionnez Ouvrir Visual Studio Code pour créer la logique personnalisée. Vous trouverez des méthodes et des scripts prédéfinis dans le fichier.

Définissez la méthode logique du serveur pour lire, modifier, créer, supprimer les enregistrements de contact.

Lecture : Ajouter un script ci-dessous à l’intérieur de la méthode get

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);
}

Créer : Ajouter un script ci-dessous dans la méthode post

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

Mise à jour : Ajouter un script ci-dessous dans la méthode put

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

Supprimer : Ajouter du code à l'intérieur de la méthode del

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);

Enregistrez le fichier.

Voici le code logique complet du serveur qui peut être collé

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 });
 }
 }

Étape 2 : Créer une page web

Lancez le studio de conception Power Pages.
Dans l’espace de travail Pages , sélectionnez + Page.
Dans la boîte de dialogue Ajouter une page , entrez la logique serveur dans la zone Nom , puis sélectionnez Démarrer à partir d’une disposition vide .
Sélectionnez Ajouter.
Sélectionnez l’option Modifier le code dans le coin supérieur droit.
Sélectionnez Ouvrir Visual Studio Code.

Copiez l’exemple de code suivant et collez-le entre les <div></div> balises de la section de page.

<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>

Étape 3 : Configurer les autorisations

Créer un rôle web

Si vous ne disposez actuellement pas d’un rôle web avec des autorisations pour la table à laquelle vous accédez via la logique du serveur ou si vous avez besoin d’un contexte différent d’accès aux données, les étapes suivantes vous montrent comment créer un rôle web et attribuer des autorisations de table.

Démarrez l’application Gestion du portail.
Dans le volet gauche, dans la section Sécurité , sélectionnez Rôles web.
Cliquez sur Nouveau.
Dans la zone Nom , entrez l’utilisateur logique du serveur (ou tout nom qui reflète le mieux le rôle de l’utilisateur accédant à cette fonctionnalité).
Dans la liste Site web, sélectionnez votre enregistrement de site web.
Cliquez sur Enregistrer.

Créer des autorisations de table

Lancez le studio de conception Power Pages.
Sélectionnez l’espace de travail Sécurité .
Sous la section Protéger , sélectionnez Autorisations de table.
Sélectionnez Nouvelle autorisation.
Dans la zone Nom, entrez Permission de Table de Contacts.
Dans la liste Nom de la table , sélectionnez Contact (contact).
Dans la liste Type d’accès , sélectionnez Global.
Sélectionnez Lire, Écrire, Créer et Supprimer des privilèges.
Sélectionnez + Ajouter des rôles et sélectionnez le rôle web que vous avez sélectionné ou créé précédemment.
Cliquez sur Enregistrer et fermer.

Ajouter des contacts au rôle web

Démarrez l’application Gestion du portail.
Dans le volet gauche, dans la section Sécurité , sélectionnez Contacts.
Sélectionnez un contact que vous souhaitez utiliser dans cet exemple pour la logique du serveur.

Note

Ce contact est le compte d’utilisateur utilisé dans cet exemple pour tester la logique du serveur. Veillez à sélectionner le contact approprié dans votre portail.
Sélectionnez Associé>Rôles web.
Sélectionnez Ajouter un rôle web existant.
Sélectionnez le rôle d’utilisateur logique du serveur , créé précédemment.
Sélectionnez Ajouter.
Cliquez sur Enregistrer et fermer.

Étape 4 : Utiliser la logique du serveur pour lire, afficher, modifier, créer et supprimer

Pour tester la fonctionnalité d’API web :

Sélectionnez Aperçu, puis choisissez Bureau.
Connectez-vous à votre site avec le compte d’utilisateur auquel vous avez attribué le rôle d’utilisateur logique serveur que vous avez créé précédemment.
Accédez à la page web logique du serveur créée précédemment.

Vue d’ensemble de la logique serveur
Écrire une logique de serveur
Objets de serveur

Commentaires

Cette page a-t-elle été utile ?

Last updated on 2025-10-18