Abilitare l'app e gli strumenti personalizzati in Microsoft 365 Copilot

[Questo argomento fa parte della documentazione non definitiva, pertanto è soggetto a modifiche.]

Power Apps in Microsoft 365 Copilot consente agli utenti di interagire con l'app basata su modello direttamente da Copilot. Quando un utente comunica con l'agente, può visualizzare i dati dell'app come interfaccia utente interattiva, una griglia per esplorare i record o un modulo per visualizzare, modificare o crearli, senza uscire dall'esperienza Copilot. È anche possibile aggiungere strumenti MCP personalizzati e interfaccia utente interattiva all'agente dichiarativo dell'app. Questa funzionalità viene ottenuta tramite app MCP che è un'estensione per MCP che consente ai server MCP di distribuire interfacce utente interattive agli host. La funzionalità funziona generando un server MCP e un agente dichiarativo dall'app.

Prerequisiti

• Un'app basata su un modello. Attualmente, questa funzionalità è disponibile solo con le app basate su modello.
• licenza Microsoft 365 Copilot. Obbligatorio sia per l'autore che distribuisce l'agente sia per gli utenti finali che interagiscono con esso.
• Autorizzazione per caricare app personalizzate in Microsoft Teams. L'amministratore di Microsoft 365 potrebbe dover abilitare questa funzionalità. Controllare le impostazioni di amministratore di Teams se l'opzione di caricamento non è visibile.

Configurare Power Apps in Copilot

1. Passare a Power Apps, selezionare l'ambiente desiderato e quindi aprire l'app basata su modello desiderata.

2. Selezionare l'icona McP dell'app sulla barra di spostamento a sinistra e quindi selezionare Configura MCP. Questa azione configura il server MCP per l'app, che fornisce strumenti MCP per le conversazioni di Copilot. Si tratta di un passaggio una tantum e può richiedere alcuni secondi per il completamento.

   

3. Salva e pubblica l'app.

4. Selezionare Scarica il pacchetto dell'app per scaricare l'agente dichiarativo generato dal MCP dell'app. Questo pacchetto contiene la definizione dell'agente, gli strumenti predefiniti per i record e i dati insieme alla configurazione necessaria per distribuire l'esperienza dell'app in Microsoft 365 copilot.

   

5. Carica il file compresso denominato in modo simile a declarative-agent-app name.zip in Microsoft Teams o Microsoft 365 Agents:

   • Teams: caricare per uso personale come app personalizzata in Teams. Altre informazioni Caricare l'app in Teams
   • Agenti di Microsoft 365: pubblicare il pacchetto per un team o un gruppo dall'interfaccia di amministrazione di Microsoft 365. Altre informazioni: Pubblicare agenti

È ora possibile porre domande sulle tabelle nell'app da questo agente dichiarativo. Gli strumenti predefiniti possono mostrare una griglia interattiva per le query del set di dati.

Inoltre, i moduli intelligenti possono essere usati per creare, visualizzare e modificare i record all'interno del contesto di Copilot di Microsoft 365.

Creare strumenti personalizzati

Oltre agli strumenti predefiniti disponibili nell'agente dichiarativo dell'app, la funzionalità può essere estesa incorporando strumenti e widget personalizzati. Un designer basato su costruttore di prompt può essere utilizzato per integrare strumenti MCP personalizzati e componenti interattivi dell'interfaccia utente nell'agente dichiarativo dell'applicazione. Nell'app Zava Airlines, ad esempio, è possibile aggiungere uno strumento personalizzato per visualizzare la mappa dei voli insieme alla sequenza temporale dei voli come diagramma di Gantt in una visualizzazione affiancata.

1. Selezionare Crea strumento personalizzato nella sezione Strumenti della scheda McP dell'app .

2. Specificare un nome e una descrizione chiari e descrittivi per lo strumento, poiché Microsoft 365 Copilot usa queste informazioni per determinare quando richiamarlo.

3. Aggiungi le istruzioni per l'output dei dati per lo strumento che per impostazione predefinita è formato JSON. È possibile trasformarlo in testo se allo strumento non è associata un'esperienza utente. Le istruzioni possono includere query per record specifici della tabella nell'app o fungere da parametro di input per l'uso nella concatenazione degli strumenti. Assicurati di sperimentare e scegliere il modello di intelligenza artificiale del prompt corretto.

   

4. Selezionare Test per controllare e convalidare l'output dello strumento e quindi selezionare Avanti. È ora possibile creare e incollare codice HTML personalizzato facoltativo specifico per questo strumento. Questo codice HTML può essere creato utilizzando il tuo strumento di sviluppo oppure lo strumento /generate-mcp-apps-ui skill. Seleziona Salva.

   

5. Scaricare il file ZIP del pacchetto dell'app aggiornato e caricare la versione più recente negli agenti di Microsoft Teams o Microsoft 365.

6. Richiamare lo strumento eseguendo la query pertinente nell'agente dell'app per visualizzare l'interfaccia utente personalizzata in azione.

   

Concatenamento di strumenti dinamici

Il concatenamento degli strumenti negli agenti dichiarativi di Power Apps usa l'agente di orchestrazione Copilot di Microsoft 365 per ragionare sulla finalità dell'utente e richiamare dinamicamente più azioni basate su MCP (strumenti) in sequenza per completare un'attività. L'agente di orchestrazione seleziona, parametrizza ed esegue la combinazione corretta di azioni dell'app MCP in base al contesto e alle descrizioni delle funzioni, consentendo flussi di lavoro end-to-end in Power Apps e sistemi aziendali. Ecco come creare uno strumento con input con parametri.

1. Selezionare Crea strumento personalizzato nella sezione Strumenti della scheda McP dell'app .

2. Specificare un nome e una descrizione chiari e descrittivi per lo strumento, poiché Microsoft 365 Copilot usa queste informazioni per determinare quando richiamarlo.

3. In questo esempio viene usato un visualizzatore grafico Sankey. Prima di tutto, definire lo schema di input JSON necessario per generare un grafico Sankey. Creare quindi un prompt per lo strumento visualizzatore grafico Sankey. Lo strumento espone un parametro di input denominato SankeyDiagramVisualizationInputData. Questo parametro viene interpretato dallo strumento e trasformato nella struttura JSON prevista dal visualizzatore. Scegliere un nome di parametro di input chiaro e descrittivo in modo che LLM possa identificare e richiamare correttamente lo strumento.

   

4. È ora possibile creare e incollare codice HTML personalizzato specifico per questo strumento. Questo codice HTML può essere creato utilizzando il tuo strumento di sviluppo oppure lo strumento /generate-mcp-apps-ui skill. Seleziona Salva.

5. Scaricare il file ZIP del pacchetto dell'app aggiornato e caricare la versione più recente in Microsoft Teams o microsoft 365 Agents.

6. Copilot può ora usare query in linguaggio naturale per recuperare i dati e passarli allo strumento per la visualizzazione. Ad esempio, è possibile usare una query complessa per ottenere in modo dinamico gli input dai dati della tabella "issues" e visualizzarli usando lo strumento Visualizzatore grafico Sankey.

   

7. È possibile perfezionare ulteriormente il grafico Sankey continuando la conversazione.

   

Esempio a schermo intero

In questo esempio viene eseguito il rendering di un pulsante di espansione solo se l'host supporta la modalità schermo intero.

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

La stessa protezione si applica a qualsiasi funzionalità host. Controllare getHostContext() prima di usare:

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

Reagire alle modifiche delle funzionalità in fase di esecuzione tramite onhostcontextchanged : il contesto host può essere aggiornato dopo connect():

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

Uso della modalità schermo intero con i risultati degli strumenti

Un modello comune consiste nel passare automaticamente a schermo intero quando il widget riceve i dati, offrendo al contenuto più spazio per il rendering.

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

È anche possibile consentire all'utente di decidere: eseguire prima il rendering nella modalità corrente, quindi offrire il pulsante di espansione:

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

Articoli correlati

Generare widget di app MCP con gli strumenti di generazione del codice di intelligenza artificiale

Domande frequenti su Power Apps negli agenti