Aktivieren Ihrer App und benutzerdefinierter Tools in Microsoft 365 Copilot

[Dieses Thema ist Teil der Dokumentation zur Vorabversion und kann geändert werden.]

Mit Power Apps in Microsoft 365 Copilot können Benutzer direkt über Copilot mit Ihrer modellgesteuerten App interagieren. Wenn ein Benutzer mit dem Agenten spricht, kann er die Daten Ihrer App als interaktive Benutzeroberfläche, ein Raster zum Durchsuchen von Datensätzen oder ein Formular zum Anzeigen, Bearbeiten oder Erstellen anzeigen lassen, ohne die Copilot-Erfahrung zu verlassen. Darüber hinaus können Sie dem deklarativen Agent der App benutzerdefinierte MCP-Tools und interaktive UI hinzufügen. Diese Funktionalität wird über MCP-Apps erreicht, bei denen es sich um eine Erweiterung von MCP handelt, mit der MCP-Server interaktive Benutzeroberflächen an Hosts bereitstellen können. Das Feature funktioniert, indem ein MCP-Server und ein deklarativer Agent aus Ihrer App generiert werden.

Voraussetzungen

• Eine modellgesteuerte App. Derzeit ist dieses Feature nur mit modellgesteuerten Apps verfügbar.
• Microsoft 365 Copilot Lizenz. Erforderlich für den Ersteller, der den Agent bereitstellt, und die Endbenutzer, die damit interagieren.
• Berechtigung zum Hochladen von benutzerdefinierten Apps in Microsoft Teams. Möglicherweise muss Ihr Microsoft 365-Administrator dies aktivieren. Überprüfen Sie Ihre Teams-Administratoreinstellungen, wenn die Uploadoption nicht sichtbar ist.

Einrichten von Power Apps in Copilot

1. Wechseln Sie zu Power Apps, wählen Sie die gewünschte Umgebung aus, und öffnen Sie dann die gewünschte modellgesteuerte App.

2. Wählen Sie auf der linken Navigationsleiste das Symbol "App MCP " aus, und wählen Sie dann "MCP einrichten" aus. Diese Aktion richtet den MCP-Server für die App ein, der MCP-Tools für Copilot-Unterhaltungen bereitstellt. Dies ist ein einmaliger Schritt und kann einige Sekunden dauern, bis sie abgeschlossen sind.

   

3. Speichern und veröffentlichen Sie die App.

4. Wählen Sie "App-Paket herunterladen" aus, um den deklarativen Agent herunterzuladen, der vom MCP Ihrer App generiert wird. Dieses Paket enthält die Agentdefinition, integrierte Tools zum Aufzeichnen und Daten sowie die Konfiguration, die zum Bereitstellen der App-Erfahrung für Microsoft 365 Copilot erforderlich ist.

   

5. Laden Sie die komprimierte Datei hoch, die ähnlich benannt ist wie declarative-agent-app name.zip zu Microsoft Teams oder Microsoft 365 Agents.

   • Teams: Hochladen für die persönliche Verwendung als benutzerdefinierte App in Teams. Weitere Informationen zum Hochladen Ihrer App in Teams
   • Microsoft 365-Agents: Veröffentlichen Sie das Paket für ein Team oder eine Gruppe aus dem Microsoft 365 Admin Center. Weitere Informationen: Veröffentlichen von Agenten

Sie können jetzt Fragen zu den Tabellen in der App von diesem deklarativen Agent stellen. Integrierte Tools können ein interaktives Raster für die Datasetabfragen anzeigen.

Darüber hinaus können intelligente Formulare zum Erstellen, Anzeigen und Bearbeiten von Datensätzen innerhalb des Microsoft 365 Copilot-Kontexts verwendet werden.

Benutzerdefinierte Tools erstellen

Zusätzlich zu den integrierten Tools, die im deklarativen Agent der App verfügbar sind, kann die Funktionalität durch die Einbindung von benutzerdefinierten Tools und Widgets erweitert werden. Ein prompt builder-basierter Designer kann verwendet werden, um benutzerdefinierte MCP-Tools und interaktive UI-Komponenten in den deklarativen Agent der App zu integrieren. Beispielsweise kann in der Zava Airlines-App ein benutzerdefiniertes Tool hinzugefügt werden, um die Flugkarte zusammen mit der Flugzeitachse als Gantt-Diagramm in einer nebeneinander angeordneten Ansicht anzuzeigen.

1. Wählen Sie unter dem Abschnitt "Extras" der Registerkarte "App MCP" die Option "Benutzerdefiniertes Tool erstellen" aus.

2. Stellen Sie einen klaren, beschreibenden Namen und eine Beschreibung für das Tool bereit, da Microsoft 365 Copilot diese Informationen verwendet, um zu bestimmen, wann sie aufgerufen werden soll.

3. Fügen Sie die Anweisungen zum Ausgeben von Daten für das Tool hinzu, das standardmäßig im JSON-Format ist. Sie können ihn in Text ändern, wenn dem Tool keine UX zugeordnet ist. Anweisungen können Abfragen für bestimmte Datensätze der Tabelle in der App umfassen oder als Eingabeparameter für das Tool dienen, das beim Tool-Chaining verwendet wird. Stellen Sie sicher, dass Sie experimentieren und das richtige KI-Modell für Eingabeaufforderungen auswählen.

   

4. Wählen Sie "Test" aus, um die Ausgabe des Tools zu prüfen und zu validieren, und wählen Sie dann "Weiter" aus. Sie können jetzt optionalen benutzerdefinierten HTML-Code, der speziell für dieses Tool ist, erstellen und einfügen. Dieser HTML-Code kann mit dem /generate-mcp-apps-ui skill oder mit einem eigenen Entwicklungstool erstellt werden. Wählen Sie "Speichern" aus.

   

5. Laden Sie das aktualisierte App-Paket zip herunter, und laden Sie die neueste Version in Microsoft Teams oder Microsoft 365-Agents hoch.

6. Rufen Sie das Tool auf, indem Sie die entsprechende Abfrage im App-Agent ausgeben, um die benutzerdefinierte Benutzeroberfläche in Aktion anzuzeigen.

   

Dynamische Toolkette

Die Tool-Verkettung in deklarativen Agenten von Power Apps nutzt den Microsoft 365 Copilot-Orchestrator, um die Absicht des Benutzers zu ermitteln und dynamisch mehrere MCP-gestützte Aktionen (Tools) nacheinander aufzurufen, um eine Aufgabe abzuschließen. Der Orchestrator wählt, parametrisiert und führt die richtige Kombination aus MCP-App-Aktionen basierend auf Kontext- und Funktionsbeschreibungen aus, wodurch End-to-End-Workflows in Power Apps und Enterprise-Systemen ermöglicht werden. Hier erfahren Sie, wie Sie ein Tool mit parametrisierter Eingabe erstellen.

1. Wählen Sie unter dem Abschnitt "Extras" der Registerkarte "App MCP" die Option "Benutzerdefiniertes Tool erstellen" aus.

2. Stellen Sie einen klaren, beschreibenden Namen und eine Beschreibung für das Tool bereit, da Microsoft 365 Copilot diese Informationen verwendet, um zu bestimmen, wann sie aufgerufen werden soll.

3. In diesem Beispiel verwenden wir eine Sankey-Diagrammschnellansicht. Definieren Sie zunächst das JSON-Eingabeschema, das zum Generieren eines Sankey-Diagramms erforderlich ist. Erstellen Sie als Nächstes eine Eingabeaufforderung für das Sankey-Diagramm-Visualisierungstool. Das Tool macht einen Eingabeparameter mit dem Namen verfügbar SankeyDiagramVisualizationInputData. Dieser Parameter wird vom Tool interpretiert und in die json-Struktur transformiert, die vom Visualizer erwartet wird. Wählen Sie einen eindeutigen und beschreibenden Eingabeparameternamen aus, damit die LLM das Tool ordnungsgemäß identifizieren und aufrufen kann.

   

4. Sie können jetzt benutzerdefiniertes HTML speziell für dieses Tool erstellen und einfügen. Dieser HTML-Code kann mit dem /generate-mcp-apps-ui skill oder mit einem eigenen Entwicklungstool erstellt werden. Wählen Sie "Speichern" aus.

5. Laden Sie das aktualisierte App-Paket zip herunter, und laden Sie die neueste Version in Microsoft Teams oder Microsoft 365 Agents hoch.

6. Copilot kann jetzt Abfragen in natürlicher Sprache verwenden, um die Daten abzurufen und an das Tool zur Visualisierung zu übergeben. Sie können z. B. eine komplexe Abfrage verwenden, um mithilfe des Tools sankey Chart Visualizer Eingaben aus den Tabellendaten "Probleme" dynamisch abzurufen und zu visualisieren.

   

7. Sie können das Sankey-Diagramm weiter verfeinern, indem Sie die Unterhaltung fortsetzen.

   

Beispiel für den Vollbildmodus

In diesem Beispiel wird eine Schaltfläche zum Erweitern nur gerendert, wenn der Host den Vollbildmodus unterstützt.

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

Derselbe Schutz gilt für jede Hostfunktion. Überprüfen Sie getHostContext() vor der Verwendung:

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

Reagieren Sie zur Laufzeit auf Fähigkeitsänderungen über onhostcontextchanged – der Hostkontext kann nach connect() aktualisiert werden.

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

Verwenden des Vollbildmodus mit Toolergebnissen

Ein gängiges Muster besteht darin, automatisch zum Vollbildmodus zu wechseln, wenn das Widget Daten empfängt und dem Inhalt mehr Platz zum Rendern gibt.

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

Sie können den Benutzer auch entscheiden lassen – zuerst im aktuellen Modus rendern und dann die Schaltfläche "Erweitern" anbieten:

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

Verwandte Artikel

Generieren von MCP-App-Widgets mit AI-Codegenerierungstools

Häufig gestellte Fragen zu Power Apps in Agents