Aktivér din app og dine brugerdefinerede værktøjer i Microsoft 365 Copilot

[Dette emne er til dokumentationen til den foreløbige udgivelse. Der kan forekomme ændringer.]

Med Power Apps i Microsoft 365 Copilot kan brugerne interagere med din modeldrevne app direkte fra Copilot. Når en bruger taler med agenten, kan den vise din apps data som interaktiv brugergrænseflade, et gitter til gennemsyn af poster eller en formular til visning, redigering eller oprettelse af dem uden at forlade Copilot-oplevelsen. Derudover kan du føje brugerdefinerede MCP-værktøjer og interaktiv brugergrænseflade til appens deklarative agent. Denne funktionalitet opnås via MCP-apps , som er en udvidelse til MCP, der gør det muligt for MCP-servere at levere interaktive brugergrænseflader til værter. Funktionen fungerer ved at generere en MCP-server og en deklarativ agent fra din app.

Forudsætninger

• En modeldrevet app. Denne funktion er i øjeblikket kun tilgængelig med modeldrevne apps.
• Microsoft 365 Copilot-licens. Påkrævet for både den udvikler, der udruller agenten, og de slutbrugere, der interagerer med den.
• Tilladelse til at uploade brugerdefinerede apps i Microsoft Teams. Din Microsoft 365-administrator skal muligvis aktivere dette. Kontrollér dine Indstillinger for Teams-administrator, hvis uploadindstillingen ikke er synlig.

Konfigurer Power Apps i Copilot

1. Gå til Power Apps, vælg det ønskede miljø, og åbn derefter den ønskede modeldrevne app.

2. Vælg app-MCP-ikonet på navigationslinjen til venstre, og vælg derefter Konfigurer MCP. Denne handling konfigurerer MCP-serveren for appen, som indeholder MCP-værktøjer til Copilot-samtaler. Dette er et engangstrin og kan tage et par sekunder at fuldføre.

   

3. Gem og Udgiv appen.

4. Vælg Download app-pakke for at downloade deklarativ agent, der er genereret af din apps MCP. Denne pakke indeholder agentdefinitionen, indbyggede værktøjer til post og data samt den konfiguration, der er nødvendig for at udrulle din apps oplevelse til Microsoft 365-copilot.

   

5. Upload den komprimerede fil, der er navngivet på samme måde som deklarative-agent-app-name.zip til Microsoft Teams eller Microsoft 365 Agents:

   • Teams: Upload til personlig brug som en brugerdefineret app i Teams. Flere oplysninger Upload din app i Teams
   • Microsoft 365 Agents: Publicer pakken for et team eller en gruppe fra Microsoft 365 Administration. Flere oplysninger: Publicer agenter

Du kan nu stille spørgsmål om tabellerne i appen fra denne deklarative agent. Indbyggede værktøjer kan vise et interaktivt gitter for datasætforespørgslerne.

Desuden kan intelligente formularer bruges til at oprette, få vist og redigere poster i Konteksten Microsoft 365 Copilot.

Opret brugerdefinerede værktøjer

Ud over de indbyggede værktøjer, der er tilgængelige i appens deklarative agent, kan dens funktionalitet udvides ved at inkorporere brugerdefinerede værktøjer og widgets. En promptgeneratorbaseret designer kan bruges til at integrere brugerdefinerede MCP-værktøjer og interaktive komponenter i brugergrænsefladen i appens deklarative agent. I appen Zava Airlines kan du f.eks. tilføje et brugerdefineret værktøj for at få vist flykortet sammen med flytidslinjen som et Gantt-diagram i en side om side-visning.

1. Vælg Opret brugerdefineret værktøj under afsnittet Værktøjer under fanen App MCP .

2. Angiv et klart, beskrivende navn og en beskrivelse af værktøjet, da Microsoft 365 Copilot bruger disse oplysninger til at bestemme, hvornår det skal aktiveres.

3. Tilføj instruktionerne for at skrive data for det værktøj, der som standard er JSON-format. Du kan ændre det til tekst, hvis værktøjet ikke har UX tilknyttet. Instruktioner kan omfatte forespørgsler om bestemte poster i tabellen i appen, eller det kan være en inputparameter til det værktøj, der skal bruges i værktøjskæde. Sørg for at eksperimentere, og vælg den rigtige prompt-AI-model.

   

4. Vælg Test for at kontrollere og validere værktøjets output, og vælg derefter Næste. Du kan nu oprette og indsætte valgfri brugerdefineret HTML, der er specifik for dette værktøj. Denne HTML kan oprettes ved hjælp af /generate-mcp-apps-ui skill eller dit eget udviklingsværktøj. Vælg Save.

   

5. Download den opdaterede apppakke zip, og upload den nyeste version til Microsoft Teams eller Microsoft 365-agenter.

6. Aktivér værktøjet ved at udstede den relevante forespørgsel i appagenten for at se den brugerdefinerede brugergrænseflade i aktion.

   

Dynamisk værktøjskæde

Værktøjskædering i deklarative agenter i Power Apps bruger Microsoft 365 Copilot Orchestrator til at begrunde brugerhensigt og dynamisk aktivere flere MCP-drevne handlinger (værktøjer) i rækkefølge for at fuldføre en opgave. Orchestratoren vælger, parameteriserer og udfører den rette kombination af MCP-apphandlinger baseret på kontekst- og funktionsbeskrivelser og aktiverer komplette arbejdsprocesser på tværs af Power Apps og virksomhedssystemer. Sådan opretter du et værktøj med parameteriseret input.

1. Vælg Opret brugerdefineret værktøj under afsnittet Værktøjer under fanen App MCP .

2. Angiv et klart, beskrivende navn og en beskrivelse af værktøjet, da Microsoft 365 Copilot bruger disse oplysninger til at bestemme, hvornår det skal aktiveres.

3. I dette eksempel bruger vi en Sankey-diagramvisualiseringsfunktion. Først skal du definere det JSON-inputskema, der kræves for at generere et Sankey-diagram. Opret derefter en prompt for visualizerværktøjet til Sankey-diagram. Værktøjet viser en inputparameter med navnet SankeyDiagramVisualizationInputData. Denne parameter fortolkes af værktøjet og transformeres til den JSON-struktur, der forventes af visualiseringen. Vælg et klart og beskrivende inputparameternavn, så LLM kan identificere og aktivere værktøjet korrekt.

   

4. Du kan nu oprette og indsætte brugerdefineret HTML, der er specifik for dette værktøj. Denne HTML kan oprettes ved hjælp af /generate-mcp-apps-ui skill eller dit eget udviklingsværktøj. Vælg Save.

5. Download den opdaterede apppakke zip, og upload den nyeste version til Microsoft Teams eller Microsoft 365 Agents.

6. Copilot kan nu bruge forespørgsler på naturligt sprog til at hente dataene og sende dem til værktøjet til visualisering. Du kan f.eks. bruge en kompleks forespørgsel til dynamisk at hente input fra tabeldataene "problemer" og visualisere dem ved hjælp af værktøjet Sankey Chart Visualizer.

   

7. Du kan tilpasse Sankey-diagrammet yderligere ved at fortsætte samtalen.

   

Eksempel på fuld skærm

I dette eksempel gengives en udvidelsesknap kun, hvis værten understøtter fuldskærmstilstand.

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

Den samme beskyttelse gælder for alle værtskapaciteter. Kontrollér getHostContext() før brug:

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 */ }

Reager på funktionsændringer på kørselstidspunktet via onhostcontextchanged – værtskonteksten kan opdateres efter connect():

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

Brug af fuldskærmstilstand med værktøjsresultater

Et almindeligt mønster er at skifte til fuld skærm automatisk, når widgetten modtager data, hvilket giver indholdet mere plads til at gengive.

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

Du kan også lade brugeren bestemme – gengive i den aktuelle tilstand først og derefter tilbyde knappen Udvid:

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

Relaterede artikler

Generér MCP-appwidgets med værktøjer til oprettelse af AI-kode

Ofte stillede spørgsmål om Power Apps i agenter