Uw app en aangepaste hulpprogramma's inschakelen in Microsoft 365 Copilot

[Dit onderwerp maakt deel uit van de voorlopige documentatie en kan nog veranderen.]

Met Power Apps in Microsoft 365 Copilot kunnen gebruikers rechtstreeks vanuit Copilot communiceren met uw modelgestuurde app. Wanneer een gebruiker met de agent praat, kunnen de gegevens van uw app worden weergegeven als interactieve gebruikersinterface, een raster voor het bladeren door records of een formulier voor het weergeven, bewerken of maken ervan, allemaal zonder de Copilot-ervaring te verlaten. Daarnaast kunt u aangepaste MCP-hulpprogramma's en interactieve gebruikersinterface toevoegen aan de declaratieve agent van de app. Deze functionaliteit wordt bereikt via MCP-apps . Dit is een uitbreiding op MCP waarmee MCP-servers interactieve gebruikersinterfaces kunnen leveren aan hosts. De functie werkt door een MCP-server en declaratieve agent te genereren vanuit uw app.

Belangrijk

  • Dit is een preview-functie.
  • Preview-functies zijn niet bedoeld voor productiegebruik en bieden mogelijk beperkte functionaliteit. Deze functies zijn beschikbaar vóór een officiële release zodat klanten vroeg toegang kunnen krijgen en feedback kunnen geven.

Prerequisites

  • Een modelgestuurde app. Deze functie is momenteel alleen beschikbaar voor modelgestuurde apps.
  • Microsoft 365 Copilot-licentie. Vereist voor zowel de maker die de agent implementeert als eindgebruikers die ermee werken.
  • Machtiging voor het uploaden van aangepaste apps in Microsoft Teams. Mogelijk moet uw Microsoft 365-beheerder dit inschakelen. Controleer de beheerinstellingen van Teams als de uploadoptie niet zichtbaar is.

Power Apps instellen in Copilot

  1. Ga naar Power Apps, selecteer de gewenste omgeving en open vervolgens de gewenste modelgestuurde app.

  2. Selecteer het MCP-pictogram van de app op de linkernavigatiebalk en selecteer MCP instellen. Met deze actie stelt u de MCP-server in voor de app, die MCP-hulpprogramma's biedt voor Copilot-gesprekken. Dit is een eenmalige stap en kan enkele seconden duren.

    MCP voor modelgestuurde app instellen

  3. Sla de app op en publiceer deze.

  4. Selecteer App-pakket downloaden om de door de MCP van uw app gegenereerde declaratieve agent te downloaden. Dit pakket bevat de agentdefinitie, ingebouwde hulpprogramma's voor record en gegevens, samen met de configuratie die nodig is om de ervaring van uw app te implementeren in Microsoft 365 Copilot.

    Knop voor het downloaden van het app-pakket vanuit de modelgestuurde appontwerper

  5. Upload het gecomprimeerde bestand met een naam die lijkt op declarative-agent-app name.zip naar Microsoft Teams of Microsoft 365 Agents.

    • Teams: Uploaden voor persoonlijk gebruik als een aangepaste app in Teams. Meer informatie Uw app uploaden in Teams
    • Microsoft 365-agents: publiceer het pakket voor een team of groep vanuit het Microsoft 365-beheercentrum. Meer informatie: Agents publiceren

U kunt nu vragen stellen over de tabellen in de app vanuit deze declaratieve agent. Ingebouwde hulpprogramma's kunnen een interactief raster weergeven voor de gegevenssetquery's.

Voorbeeld van het bekijken van vluchten die zijn geretourneerd door de declaratieve agent

Daarnaast kunnen intelligente formulieren worden gebruikt voor het maken, weergeven en bewerken van records binnen de Microsoft 365 Copilot-context.

Voorbeeld van het maken van een nieuwe record vanuit e-mail via declaratieve agent

Note

U kunt de declaratieve agent die is opgenomen in het app-pakket naar eigen goeddunken aanpassen. Om de kans op onverwacht gedrag bij het gebruik van AI-agents te verminderen, moet u voorzichtig zijn wanneer u de declaratieve agentcode aanpast. Meer informatie: Declaratieve agents voor Microsoft 365 Copilot.

Aangepaste hulpprogramma's maken

Naast de ingebouwde hulpprogramma's die beschikbaar zijn in de declaratieve agent van de app, kan de functionaliteit ervan worden uitgebreid door aangepaste hulpprogramma's en widgets te integreren. Een opbouwfunctie op basis van prompts kan worden gebruikt om aangepaste MCP-hulpprogramma's en interactieve UI-onderdelen te integreren in de declaratieve agent van de app. In de Zava Airlines-app kan bijvoorbeeld een aangepast hulpmiddel worden toegevoegd om de vluchtkaart naast de vluchttijdlijn weer te geven als gantt-diagram in een weergave naast elkaar.

Belangrijk

  1. Selecteer Aangepast hulpprogramma maken onder de sectie Extra van het tabblad App MCP .

  2. Geef een duidelijke, beschrijvende naam en beschrijving op voor het hulpprogramma, omdat Microsoft 365 Copilot deze informatie gebruikt om te bepalen wanneer deze moet worden aangeroepen.

  3. Voeg de instructies toe voor het uitvoeren van gegevens voor het hulpprogramma dat standaard de JSON-indeling heeft. U kunt deze wijzigen in tekst als er geen UX aan het hulpprogramma is gekoppeld. Instructies kunnen query's voor specifieke records van de tabel in de app omvatten of betrekking hebben op een invoerparameter voor het hulpprogramma dat moet worden gebruikt bij het koppelen van hulpprogramma's. Zorg ervoor dat u experimenteert en het juiste AI-model voor prompts kiest.

    Een aangepast hulpprogramma maken om vluchtgegevens weer te geven

  4. Selecteer Testen om de uitvoer van het hulpprogramma te controleren en te valideren en selecteer vervolgens Volgende. U kunt nu optionele aangepaste HTML maken en plakken die specifiek is voor dit hulpprogramma. Deze HTML kan worden gemaakt met behulp van het /generate-mcp-apps-ui skill of uw eigen ontwikkelhulpprogramma. Selecteer Opslaan.

    Voorbeeld van aangepast hulpprogramma- JSON-uitvoer

  5. Download het bijgewerkte app-pakket zip en upload de nieuwste versie naar Microsoft Teams of Microsoft 365-agents.

  6. Roep het hulpprogramma aan door de relevante query in de app-agent uit te geven om de aangepaste gebruikersinterface in actie te zien.

    Aangepaste gebruikersinterface gemaakt waarin vluchttijden worden weergegeven

Note

U kunt de opdracht '-developer on' uitgeven aan Microsoft 365 Copilot om foutopsporingsgegevens en hulpprogramma's van agents weer te geven die zijn aangeroepen. Voor het oplossen van veelvoorkomende problemen, raadpleegt u Problemen met MCP-apps in Microsoft 365 Copilot oplossen

Dynamische ketenvorming voor hulpprogramma's

Het koppelen van hulpprogramma's in Power Apps-declaratie-agenten maakt gebruik van de Microsoft 365 Copilot-orchestrator om over gebruikersintentie te redeneren en dynamisch meerdere door MCP aangedreven acties (hulpprogramma's) opeenvolgend aan te roepen om een taak te voltooien. De orchestrator selecteert, parameteriseert en voert de juiste combinatie van MCP-app-acties uit op basis van context- en functiebeschrijvingen, waardoor end-to-end-werkstromen in Power Apps en bedrijfssystemen mogelijk zijn. U maakt als volgt een hulpprogramma met geparameteriseerde invoer.

  1. Selecteer Aangepast hulpprogramma maken onder de sectie Extra van het tabblad App MCP .

  2. Geef een duidelijke, beschrijvende naam en beschrijving op voor het hulpprogramma, omdat Microsoft 365 Copilot deze informatie gebruikt om te bepalen wanneer deze moet worden aangeroepen.

  3. In dit voorbeeld gebruiken we een Sankey-diagram visualiseren. Definieer eerst het JSON-invoerschema dat is vereist voor het genereren van een Sankey-grafiek. Maak vervolgens een prompt voor het hulpprogramma voor het visualiseren van sankey-grafieken. Het hulpprogramma toont een invoerparameter met de naam SankeyDiagramVisualizationInputData. Deze parameter wordt geïnterpreteerd door het hulpprogramma en omgezet in de JSON-structuur die wordt verwacht door de visualizer. Kies een duidelijke en beschrijvende naam van de invoerparameter, zodat de LLM het hulpprogramma correct kan identificeren en aanroepen.

    Aangepast hulpprogramma met gereedschapskoppeling

  4. U kunt nu aangepaste HTML maken en plakken die specifiek is voor dit hulpprogramma. Deze HTML kan worden gemaakt met behulp van het /generate-mcp-apps-ui skill of uw eigen ontwikkelhulpprogramma. Selecteer Opslaan.

  5. Download het bijgewerkte app-pakket zip en upload de nieuwste versie naar Microsoft Teams of Microsoft 365-agents.

  6. Copilot kan nu query's in natuurlijke taal gebruiken om de gegevens op te halen en door te geven aan het hulpprogramma voor visualisatie. U kunt bijvoorbeeld een complexe query gebruiken om dynamisch invoer op te halen uit de tabelgegevens 'issues' en deze te visualiseren met behulp van het hulpprogramma Sankey Chart Visualizer.

    Sankey-diagramvisualisator die gegevens van de probleemtabel toont.

  7. U kunt de Sankey-grafiek verder verfijnen door het gesprek voort te zetten.

    Sankey-diagram visualiseren met aanvullende informatie uit gesprek.

Voorbeeld van volledig scherm

In dit voorbeeld wordt een uitvouwknop alleen weergegeven als de host de modus Volledig scherm ondersteunt.

function renderExpandButton(app) {
  const ctx = app.getHostContext();

  // Don't render the button if the host doesn't support fullscreen
  if (!ctx?.availableDisplayModes?.includes('fullscreen')) {
    return null;
  }

  const btn = document.createElement('button');
  btn.addEventListener('click', async () => {
    const result = await app.requestDisplayMode({ mode: 'fullscreen' });
    // Always use result.mode — the host may grant a different mode than requested
    console.log('Granted mode:', result.mode);
  });
  return btn;
}

Dezelfde beveiliging is van toepassing op elke hostmogelijkheid. Controleer getHostContext() voor gebruik:

const ctx = app.getHostContext();

// Theme
if (ctx?.theme) applyTheme(ctx.theme);

// Current display mode
if (ctx?.displayMode === 'fullscreen') { /* adjust layout */ }

// Available modes
if (ctx?.availableDisplayModes?.includes('inline')) { /* show collapse option */ }

Reageren op capaciteitswijzigingen tijdens runtime via onhostcontextchanged : de hostcontext kan worden bijgewerkt na connect():

app.onhostcontextchanged = (ctx) => {
  if (ctx.theme) applyTheme(ctx.theme);
  if (ctx.displayMode) updateLayout(ctx.displayMode);
};

De modus Volledig scherm gebruiken met de resultaten van het hulpprogramma

Een veelvoorkomend patroon is om automatisch over te schakelen naar volledig scherm wanneer de widget gegevens ontvangt, zodat de inhoud meer ruimte heeft om weer te geven.

app.ontoolresult = async (result) => {
  const data = result.structuredContent;
  if (!data) return;

  // Expand to fullscreen when data arrives, if the host supports it
  const ctx = app.getHostContext();
  if (ctx?.availableDisplayModes?.includes('fullscreen') && currentMode !== 'fullscreen') {
    const granted = await app.requestDisplayMode({ mode: 'fullscreen' });
    currentMode = granted.mode;
    document.body.classList.toggle('mode-fullscreen', currentMode === 'fullscreen');
  }

  renderData(data);
};

U kunt de gebruiker ook laten beslissen: eerst weergeven in de huidige modus en vervolgens de knop Uitvouwen aanbieden:

app.ontoolresult = (result) => {
  const data = result.structuredContent;
  if (!data) return;

  renderData(data);        // render in whatever mode is active
  updateExpandBtn();       // show the expand button now that there is content
};

MCP-app-widgets genereren met hulpprogramma's voor het genereren van AI-code

Veelgestelde vragen over Power Apps in agents