Crear y enviar cuadros de diálogo

Puedes crear un cuadro de diálogo modal (denominado módulo de tareas en TeamsJS v1.x) con una tarjeta adaptativa o una vista web incrustada. Para crear un cuadro de diálogo, debe realizar el proceso denominado solicitud de invocación inicial. Este documento abarca la solicitud de invocación inicial, las propiedades de la actividad de carga cuando se invoca un cuadro de diálogo desde un chat individual, chat grupal, canal (nueva publicación), canal (responder a la conversación) y cuadro de comandos.

La solicitud de invocación inicial

En el proceso de la solicitud de invocación inicial, el servicio recibe un objeto Activity de tipo composeExtensions/fetchTask y debe responder con un objeto task que contenga una tarjeta adaptable o una dirección URL a la vista web incrustada. Junto con las propiedades de actividad del bot estándar, la carga de invocación inicial contiene los siguientes metadatos de solicitud:

Ejemplo

El código para la solicitud de invocación inicial se proporciona en el ejemplo siguiente:

{
  "type": "invoke",
  "id": "f:bc319b1d-571a-194d-9ffb-11d7ab37c9ff",
  "from": {
    "id": "29:1aBjVi5MwCFfhPIV03E5uDdfpBFXp_2Yz-sjrvVg12oavg96cqpE_DiMhOpmN9zHeZpYbJcuUEKuSDy2AYWPz1A",
    "name": "Olo Brockhouse",
    "aadObjectId": "b130c271-d2eb-45f9-83ab-9eb3fe3788bc"
  }
  "channelData": {
    "tenant": {
      "id": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
    },
    "source": {
      "name": "compose"
    }
  },
  "value": {
    "commandId": "Test",
    "commandContext": "compose",
    "requestId": "fe50f49e5c74440bb2ebf07f49e9553c",
    "context": {
      "theme": "default"
    }
  },
  "name": "composeExtension/fetchTask"

Propiedades de actividad de carga cuando se invoca un cuadro de diálogo desde un chat 1:1

Las propiedades de la actividad de carga cuando se invoca un cuadro de diálogo desde un chat 1:1 se enumeran a continuación:

Ejemplo

Las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un chat 1:1 se proporcionan en el ejemplo siguiente:

{
  "type": "invoke",
  "id": "f:bc319b1d-571a-194d-9ffb-11d7ab37c9ff",
  "from": {
    "id": "29:1aBjVi5MwCFfhPIV03E5uDdfpBFXp_2Yz-sjrvVg12oavg96cqpE_DiMhOpmN9zHeZpYbJcuUEKuSDy2AYWPz1A",
    "name": "Olo Brockhouse",
    "aadObjectId": "b130c271-d2eb-45f9-83ab-9eb3fe3788bc"
  }
  "channelData": {
    "tenant": {
      "id": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
    },
    "source": {
      "name": "compose"
    }
  },
  "value": {
    "commandId": "Test",
    "commandContext": "compose",
    "requestId": "fe50f49e5c74440bb2ebf07f49e9553c",
    "context": {
      "theme": "default"
    }
  },
  "name": "composeExtension/fetchTask"
}

Propiedades de actividad de carga cuando se invoca un cuadro de diálogo desde un chat grupal

Las propiedades de la actividad de carga cuando se invoca un cuadro de diálogo desde un chat grupal se enumeran a continuación:

Ejemplo

Las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un chat grupal se proporcionan en el ejemplo siguiente:

{
  "type": "invoke",
  "id": "f:bf72031f-a17e-f99c-48dc-5c0714950d87",
  "from": {
    "id": "29:1aBjVi5MwCFfhPIV03E5uDdfpBFXp_2Yz-sjrvVg12oavg96cqpE_DiMhOpmN9zHeZpYbJcuUEKuSDy2AYWPz1A",
    "name": "Olo Brockhouse",
    "aadObjectId": "b130c271-d2eb-45f9-83ab-9eb3fe3788bc"
  },
  "conversation": {
    "isGroup": true,
    "conversationType": "groupChat",
    "id": "19:d77be72390a1416e9644261e9064fa00@thread.skype",
    "tenantId": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
  },
  "channelData": {
    "tenant": {
      "id": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
    },
    "source": {
      "name": "compose"
    }
  },
  "value": {
    "commandId": "Test",
    "commandContext": "compose",
    "requestId": "213167a1e3b6428b93e186ea5407c759",
    "context": {
      "theme": "default"
    }
  },
  "name": "composeExtension/fetchTask"
}

Propiedades de la actividad de carga cuando se invoca un cuadro de diálogo desde un chat de reunión

En el ejemplo siguiente se indican las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un chat de reunión:

{
   "type": "invoke",
   "id": "f:4d271f11-4eed-622f-e820-6d82bf91692f",
   "channelId": "msteams",
   "from": {
      "id": "29:1yLsdbTM1UjxqqD8cjduNUCI1jm8xZaH3lx9u5JQ04t2bknuTCkP45TXdfROTOWk1LzN1AqTgFZUEqHIVGn_qUA",
      "name": "MOD Administrator",
      "aadObjectId": "ef16aa89-5b26-4a2c-aebb-761b551577c0"
   },
   "conversation": {
      "tenantId": "c9f9aafd-64ac-4f38-8e05-12feba3fb090",
      "id": "19:meeting_NTk4ZDY4ZmYtOWEzZS00OTRkLThhY2EtZmUzZmUzMDQyM2M0@thread.v2",
      "name": "Test meeting"
   },   
   "channelData": {
      "tenant": {
         "id": "c9f9aafd-64ac-4f38-8e05-12feba3fb090"
      },
      "source": {
         "name": "compose"
      },
      "meeting": {
         "id": "MCMxOTptZWV0aW5nX05UazRaRFk0Wm1ZdE9XRXpaUzAwT1RSa0xUaGhZMkV0Wm1VelptVXpNRFF5TTJNMEB0aHJlYWQudjIjMA=="
      }
   },
   "value": {
      "commandId": "Test",
      "commandContext": "compose",
      "requestId": "c46a6b53573f42b5bc801716e5ccc960",
      "context": {
         "theme": "default"
      }
   },
   "name": "composeExtension/fetchTask",
}

Propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un canal (nueva publicación)

Las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un canal (nueva publicación) se enumeran a continuación:

Ejemplo

Las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un canal (new post) se proporcionan en el siguiente ejemplo:

{
  "type": "invoke",
  "id": "f:a5fbb109-c989-c449-ee83-71ac99919d4b",
  "from": {
    "id": "29:1aBjVi5MwCFfhPIV03E5uDdfpBFXp_2Yz-sjrvVg12oavg96cqpE_DiMhOpmN9zHeZpYbJcuUEKuSDy2AYWPz1A",
    "name": "Olo Brockhouse",
    "aadObjectId": "b130c271-d2eb-45f9-83ab-9eb3fe3788bc"
  },
  "conversation": {
    "isGroup": true,
    "conversationType": "channel",
    "id": "19:6decf54d86d945e4b3924b63a9161a78@thread.skype",
    "name": "parsable",
    "tenantId": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
  },
  "channelData": {
    "channel": {
      "id": "19:6decf54d86d945e4b3924b63a9161a78@thread.skype"
    },
    "team": {
      "id": "19:acca514e83cb497e960e0b014d405336@thread.skype"
    },
    "tenant": {
      "id": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
    },
    "source": {
      "name": "compose"
    }
  },
  "value": {
    "commandId": "Test",
    "commandContext": "compose",
    "requestId": "5336640edc7748b28ce2df43f5b45963",
    "context": {
      "theme": "default"
    }
  },
  "name": "composeExtension/fetchTask"
}

Propiedades de la actividad de carga cuando se invoca un cuadro de diálogo desde un canal (responder a la conversación)

Las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un canal (responder a la conversación) se enumeran a continuación:

Ejemplo

Las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un canal (responder a la conversación) se proporcionan en el ejemplo siguiente:

{
  "type": "invoke",
  "id": "f:19ccc884-c792-35ef-2f40-d0ff43dcca71",
  "from": {
    "id": "29:1aBjVi5MwCFfhPIV03E5uDdfpBFXp_2Yz-sjrvVg12oavg96cqpE_DiMhOpmN9zHeZpYbJcuUEKuSDy2AYWPz1A",
    "name": "Olo Brockhouse",
    "aadObjectId": "b130c271-d2eb-45f9-83ab-9eb3fe3788bc"
  },
  "conversation": {
    "isGroup": true,
    "conversationType": "channel",
    "id": "19:6decf54d86d945e4b3924b63a9161a78@thread.skype;messageid=1611060744833",
    "name": "parsable",
    "tenantId": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
  },
  "channelData": {
    "channel": {
      "id": "19:6decf54d86d945e4b3924b63a9161a78@thread.skype"
    },
    "team": {
      "id": "19:acca514e83cb497e960e0b014d405336@thread.skype"
    },
    "tenant": {
      "id": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
    },
    "source": {
      "name": "compose"
    }
  },
  "value": {
    "commandId": "TEst",
    "commandContext": "message",
    "requestId": "7f7d22efe5414818becebcec649a7912",
    "messagePayload": {
      "linkToMessage": "https://teams.microsoft.com/l/message/19:6decf54d86d945e4b3924b63a9161a78@thread.skype/1611060744833",
      "id": "1611060744833",
      "replyToId": null,
      "createdDateTime": "2021-01-19T12:52:24.833Z",
      "lastModifiedDateTime": null,
      "deleted": false,
      "summary": null,
      "importance": "normal",
      "locale": "en-us",
      "body": {
        "contentType": "html",
        "content": "<div><div><at id=\"0\">Testing outgoing Webhook-Nikitha</at> - Hi</div>\n</div>"
      },
      "from": {
        "device": null,
        "conversation": null,
        "user": {
          "userIdentityType": "aadUser",
          "id": "b130c271-d2eb-45f9-83ab-9eb3fe3788bc",
          "displayName": "Olo Brockhouse"
        },
        "application": null
      },
      "reactions": [],
      "mentions": [
        {
          "id": 0,
          "mentionText": "Testing outgoing Webhook-Nikitha",
          "mentioned": {
            "device": null,
            "conversation": null,
            "user": null,
            "application": {
              "applicationIdentityType": "webhook",
              "id": "b8c1c68c-e290-4bdd-81c3-266f310751dc",
              "displayName": "Testing outgoing Webhook-Nikitha"
            }
          }
        }
      ],
      "attachments": []
    },
    "context": {
      "theme": "default"
    }
  },
  "name": "composeExtension/fetchTask"
}

Propiedades de actividad de carga cuando se invoca un cuadro de diálogo desde un cuadro de comandos

Las propiedades de la actividad de carga cuando se invoca un cuadro de diálogo desde un cuadro de comandos son las siguientes:

Ejemplo

En el ejemplo siguiente se indican las propiedades de la actividad de carga útil cuando se invoca un cuadro de diálogo desde un cuadro de comandos:

{
  "type": "invoke",
  "id": "f:172560f1-95f9-3189-edb2-b7612cd1a3cd",
    "id": "29:1aBjVi5MwCFfhPIV03E5uDdfpBFXp_2Yz-sjrvVg12oavg96cqpE_DiMhOpmN9zHeZpYbJcuUEKuSDy2AYWPz1A",
    "name": "Olo Brockhouse",
    "aadObjectId": "b130c271-d2eb-45f9-83ab-9eb3fe3788bc"
  },
  "conversation": {
    "isGroup": true,
    "conversationType": "channel",
    "id": "19:6decf54d86d945e4b3924b63a9161a78@thread.skype",
    "name": "parsable",
    "tenantId": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
  },
  "channelData": {
    "channel": {
      "id": "19:6decf54d86d945e4b3924b63a9161a78@thread.skype"
    },
    "team": {
      "id": "19:acca514e83cb497e960e0b014d405336@thread.skype"
    },
    "tenant": {
      "id": "0d9b645f-597b-41f0-a2a3-ef103fbd91bb"
    },
    "source": {
      "name": "compose"
    }
  },
  "value": {
    "commandId": "TEst",
    "commandContext": "compose",
    "requestId": "d2ce690cdc2b4920a538e75882610a30",
    "context": {
      "theme": "default"
    }
  },
  "name": "composeExtension/fetchTask"
}

Ejemplo

La siguiente sección de código es un ejemplo de solicitud fetchTask:

using Microsoft.Teams.Apps.MessageExtensions;

// ...

teams.OnFetchTask(async (context, cancellationToken) =>
{
    // Handle fetch task
  MessageExtensionAction? action = context.Activity.Value;
  string? commandId = action?.CommandId;

  return MessageExtensionActionResponse.CreateBuilder().Build();
});

using Microsoft.Teams.Api.MessageExtensions;

// ...

teams.OnFetchTask(async (ctx) =>
{
    // Handle fetch task
    var commandId = ctx.Activity.Value?.CommandId;

    return new ActionResponse();
});

import { App } from '@microsoft/teams.apps';

// ...

app.on('message.ext.open', async ({ activity }) => {
  // Handle fetch task
  const commandId: string | undefined = activity.value?.commandId;
});

from microsoft_teams.api import MessageExtensionFetchTaskInvokeActivity
from microsoft_teams.apps import ActivityContext, App

# ...

@app.on_message_ext_open
async def handle_fetch_task(
    ctx: ActivityContext[MessageExtensionFetchTaskInvokeActivity]
):
    # Handle fetch task
    command_id = ctx.activity.value.command_id

{
  "name": "composeExtension/fetchTask",
  "type": "invoke",
  "timestamp": "2019-07-01T22:57:22.175Z",
  "localTimestamp": "2019-07-01T15:57:22.175-07:00",
  "id": "f:0123456878990178955",
  "channelId": "msteams",
  "serviceURL": "https://smba.trafficmanager.net/amer/",
  "from": {
    "id": "29:1test2GgHIa0DXzDT_OGwL5vSMZdAxDlGR7hYxZ6_JBVqHz2Zq9Nm44FUNWqHCdGBwHg8WrlFRsYrd0cCAS7dig",
    "name": "John Smith",
    "aadObjectId": "1234567d-1234-462a-8952-35b75f16f1e1"
  },
  "conversation": {
    "isGroup": true,
    "conversationType": "channel",
    "tenantId": "1234abcd-1234-12ab-12ab-35b75f16f1e1",
    "id": "19:83ed1d507cb5427c93495cf914326310@thread.skype"
  },
  "recipient": {
    "id": "28:049566e0-4401-4bcf-86a1-ce22082ce03a",
    "name": "mess"
  },
  "entities": [
    {
      "locale": "en-US",
      "country": "US",
      "platform": "Windows",
      "type": "clientInfo"
    }
  ],
  "channelData": {
    "channel": {
      "id": "19:83ab1d507cb5427c93495cf912345678@thread.skype"
    },
    "team": {
      "id": "19:83ab1d507cb5427c93495cf912345678@thread.skype"
    },
    "tenant": {
      "id": "1234abcd-1234-12ab-12ab-35b75f16f1e1"
    },
    "source": {
      "name": "compose"
    }
  },
  "value": {
    "commandId": "hello",
    "commandContext": "compose",
    "context": {
      "theme": "dark"
    }
  },
  "locale": "en-US"
}

Solicitud de invocación inicial de un mensaje

Cuando se invoca al bot desde un mensaje, el value objeto de la solicitud de llamada inicial debe contener los detalles del mensaje desde el que se invoca la extensión de mensaje. Las matrices reactions y mentions son opcionales y no están presentes si no hay reacciones ni menciones en el mensaje original. La sección siguiente es un ejemplo del objeto value:

using Microsoft.Teams.Apps.MessageExtensions;

// ...

teams.OnFetchTask(async (context, cancellationToken) =>
{
  MessageExtensionAction? action = context.Activity.Value;

  var messageText = action?.MessagePayload?.Body?.Content;
  var fromId = action?.MessagePayload?.From?.User?.Id;

  return MessageExtensionActionResponse.CreateBuilder().Build();
});

teams.OnFetchTask(async (ctx) =>
{
    var messageText =
        ctx.Activity.Value?.MessagePayload?.Body?.Content;

    var fromId =
        ctx.Activity.Value?.MessagePayload?.From?.User?.Id;

    // Finish handling the fetchTask
    return new ActionResponse();
});

app.on('message.ext.open', async ({ activity }) => {
    const messageText: string | undefined =
        activity.value?.messagePayload?.body?.content;

    // Finish handling the fetchTask
});

@app.on_message_ext_open
async def handle_fetch_task(
    ctx: ActivityContext[MessageExtensionFetchTaskInvokeActivity]
):
    message_text = ctx.activity.value.message_payload.body.content
    from_id = ctx.activity.value.message_payload.from_property.user.id

    # Finish handling the fetchTask

{
  "name": "composeExtension/submitAction",
  "type": "invoke",
...
  "value": {
    "commandId": "setReminder",
    "commandContext": "message",
    "messagePayload": {
      "id": "1111111111",
      "replyToId": null,
      "createdDateTime": "2019-02-25T21:29:36.065Z",
      "lastModifiedDateTime": null,
      "deleted": false,
      "subject": "Message subject",
      "summary": null,
      "importance": "normal",
      "locale": "en-us",
      "body": {
        "contentType": "html",
        "content": "This is the message the messaging extension was invoked from."
    },
      "from": {
        "device": null,
        "conversation": null,
        "user": {
          "userIdentityType": "aadUser",
          "id": "wxyz12ab8-ab12-cd34-ef56-098abc123876",
          "displayName": "Jamie Smythe"
        },
        "application": null
      },
      "reactions": [
        {
          "reactionType": "like",
          "createdDateTime": "2019-02-25T22:40:40.806Z",
          "user": {
            "device": null,
            "conversation": null,
            "user": {
              "userIdentityType": "aadUser",
              "id": "qrst12346-ab12-cd34-ef56-098abc123876",
              "displayName": "Jim Brown"
            },
            "application": null
          }
        }
      ],
      "mentions": [
        {
          "id": 0,
          "mentionText": "Sarah",
          "mentioned": {
            "device": null,
            "conversation": null,
            "user": {
              "userIdentityType": "aadUser",
              "id": "ab12345678-ab12-cd34-ef56-098abc123876",
              "displayName": "Sarah"
            },
            "application": null
          }
        }
      ]
    }
  ...

Responder a fetchTask

Responda a la solicitud de invocación con un objeto task que contenga un objeto taskInfo con la tarjeta adaptable o la dirección URL web, o un mensaje de cadena simple.

El esquema del objeto taskInfo es:

Responder a fetchTask con una tarjeta adaptable

Cuando se usa una tarjeta adaptable, debe responder con un task objeto que contiene una value tarjeta adaptable.

Ejemplo

La siguiente sección de código es un ejemplo de cómo fetchTask responder con una tarjeta adaptable:

using System.Text.Json;
using Microsoft.Teams.Apps.MessageExtensions;
using Microsoft.Teams.Apps.Schema;
using Microsoft.Teams.Apps.TaskModules;
using Microsoft.Teams.Cards;

// ...

teams.OnFetchTask(async (context, cancellationToken) =>
{
    string placeholder = "Not invoked from message";

  MessageExtensionAction? action = context.Activity.Value;

  if (action?.MessagePayload != null)
    {
    var messageText = action.MessagePayload.Body?.Content;
    var fromId = action.MessagePayload.From?.User?.Id;
        placeholder = "Invoked from message";
    }

    var card = new AdaptiveCard
    {
        Version = "1.5",
        Body = new List<CardElement>
        {
            new TextInput { Id = "FormField1", Placeholder = placeholder },
            new TextInput { Id = "FormField2", Placeholder = "FormField2" },
            new TextInput { Id = "FormField3", Placeholder = "FormField3" }
        },
        Actions = new List<Cards.Action>
        {
            new SubmitAction { Title = "Submit" }
        }
    };

    TeamsAttachment attachment = TeamsAttachment.CreateBuilder()
      .WithAdaptiveCard(JsonSerializer.SerializeToElement(card))
      .Build();

    return MessageExtensionActionResponse.CreateBuilder()
      .WithTask(TaskModuleResponse.CreateBuilder()
        .WithType(TaskModuleResponseTypes.Continue)
        .WithTitle("Example dialog")
        .WithHeight(TaskModuleSizes.Small)
        .WithWidth(TaskModuleSizes.Small)
        .WithCard(attachment))
      .Build();
});

using Microsoft.Teams.Api;
using Microsoft.Teams.Api.MessageExtensions;
using Microsoft.Teams.Api.TaskModules;
using Microsoft.Teams.Cards;
using Microsoft.Teams.Common;

// ...

teams.OnFetchTask(async (ctx) =>
{
    string placeholder = "Not invoked from message";

    if (ctx.Activity.Value?.MessagePayload != null)
    {
        var messageText = ctx.Activity.Value.MessagePayload.Body?.Content;
        var fromId = ctx.Activity.Value.MessagePayload.From?.User?.Id;
        placeholder = "Invoked from message";
    }

    var card = new AdaptiveCard
    {
        Body = new List<CardElement>
        {
            new TextInput { Id = "FormField1", Placeholder = placeholder },
            new TextInput { Id = "FormField2", Placeholder = "FormField2" },
            new TextInput { Id = "FormField3", Placeholder = "FormField3" }
        },
        Actions = new List<Cards.Action>
        {
            new SubmitAction { Title = "Submit" }
        }
    };

    return new ActionResponse
    {
        Task = new ContinueTask(
            new TaskInfo
            {
                Title = "Example dialog",
                Height = new Union<int, Size>(Size.Small),
                Width  = new Union<int, Size>(Size.Small),
                Card   = new Attachment(card)
            })
    };
});

import { cardAttachment } from '@microsoft/teams.api';
import { App } from '@microsoft/teams.apps';
import { AdaptiveCard } from '@microsoft/teams.cards';

// ...

app.on('message.ext.open', async ({ activity }) => {
  const userText: string =
    activity.value?.messagePayload?.body?.content || '';

  const card: AdaptiveCard = AdaptiveCard.from({
    type: 'AdaptiveCard',
    version: '1.0',
    body: [
      {
        type: 'TextBlock',
        text: 'Task Module',
        weight: 'bolder',
      },
      {
        type: 'TextBlock',
        text: 'Enter text for Question:',
      },
      {
        type: 'Input.Text',
        id: 'Question',
        placeholder: 'Question text here',
        value: userText,
      },
      {
        type: 'TextBlock',
        text: 'Options for Question:',
      },
      {
        type: 'Input.Text',
        id: 'Option1',
        placeholder: 'Option 1 here',
      },
      {
        type: 'Input.Text',
        id: 'Option2',
        placeholder: 'Option 2 here',
      },
    ],
    actions: [
      {
        type: 'Action.Submit',
        title: 'Submit',
        data: {
          submitLocation: 'messagingExtensionFetchTask',
        },
      },
    ],
  });

  return {
    task: {
      type: 'continue' as const,
      value: {
        card: cardAttachment('adaptive', card),
        height: 450,
        width: 500,
        title: 'Task Module Fetch Example',
      },
    },
  };
});

from microsoft_teams.api import (
    AdaptiveCardAttachment,
    MessageExtensionFetchTaskInvokeActivity,
    card_attachment,
)
from microsoft_teams.api.models import (
    CardTaskModuleTaskInfo,
    MessagingExtensionActionInvokeResponse,
    TaskModuleContinueResponse,
)
from microsoft_teams.apps import ActivityContext, App
from microsoft_teams.cards import AdaptiveCard


# ...


@app.on_message_ext_open
async def handle_fetch_task(
    ctx: ActivityContext[MessageExtensionFetchTaskInvokeActivity],
):
    placeholder = "Not invoked from message"

    if ctx.activity.value.message_payload:
        message_text = ctx.activity.value.message_payload.body.content
        placeholder = "Invoked from message"

    card = AdaptiveCard.model_validate(
        {
            "type": "AdaptiveCard",
            "version": "1.0",
            "body": [
                {
                    "type": "Input.Text",
                    "id": "FormField1",
                    "placeholder": placeholder,
                },
                {
                    "type": "Input.Text",
                    "id": "FormField2",
                    "placeholder": "FormField2",
                },
                {
                    "type": "Input.Text",
                    "id": "FormField3",
                    "placeholder": "FormField3",
                },
            ],
            "actions": [
                {"type": "Action.Submit", "title": "Submit"},
            ],
        }
    )

    card_info = CardTaskModuleTaskInfo(
        title="Example dialog",
        height="small",
        width="small",
        card=card_attachment(
            AdaptiveCardAttachment(content=card)
        ),
    )

    task = TaskModuleContinueResponse(value=card_info)
    return MessagingExtensionActionInvokeResponse(task=task)

 {​
  "task": {​
    "type": "continue",
    "value": {​
      "title": "Dialog title",
      "height": 500,
      "width": "medium",
      "card": {​
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
          {​
            "type": "Input.Text",
            "placeholder": "FormField1",
            "id": "FormField1"
          }​,
          {​
            "type": "Input.Text",
            "placeholder": "FormField2",
            "id": "FormField2"
          }​,
          {​
            "type": "Input.Text",
            "placeholder": "FormField3",
            "id": "FormField3"
          }​,
          {​
            "type": "ActionSet",
            "actions": [
              {​
                "type": "Action.Submit",
                "title": "Action.Submit",
                "id": "submitAction"
              }​
            ]
          }​
        ]
      }​
    }​
  }​
}​

Crear un cuadro de diálogo con una vista web incrustada

Al usar una vista web incrustada, debe responder con un objeto task con el objeto value que contiene la dirección URL del formulario web que desea cargar. Los dominios de cualquier dirección URL que quiera cargar deben incluirse en la matriz validDomains del manifiesto de la aplicación. Para obtener más información sobre cómo crear la vista web incrustada, consulte la documentación del cuadro de diálogo.

using Microsoft.Teams.Apps.MessageExtensions;
using Microsoft.Teams.Apps.TaskModules;

// ...

teams.OnFetchTask(async (context, cancellationToken) =>
{
    await Task.CompletedTask;

    return MessageExtensionActionResponse.CreateBuilder()
        .WithTask(TaskModuleResponse.CreateBuilder()
            .WithType(TaskModuleResponseTypes.Continue)
            .WithTitle("Example dialog")
            .WithHeight(TaskModuleSizes.Small)
            .WithWidth(TaskModuleSizes.Small)
            .WithUrl("https://contoso.com/msteams/taskmodules/newcustomer"))
        .Build();
});

using Microsoft.Teams.Api.MessageExtensions;
using Microsoft.Teams.Api.TaskModules;
using Microsoft.Teams.Common;

// ...

teams.OnFetchTask(async (ctx) =>
{
    return new ActionResponse
    {
        Task = new ContinueTask(
            new TaskInfo
            {
                Title = "Example dialog",
                Height = new Union<int, Size>(Size.Small),
                Width = new Union<int, Size>(Size.Small),
                Url = "https://contoso.com/msteams/taskmodules/newcustomer"
            })
    };
});

app.on('message.ext.open', async ({ activity }) => {
  return {
    task: {
      type: 'continue' as const,
      value: {
        width: 500,
        height: 450,
        title: 'Task Module Fetch Example',
        url: 'https://contoso.com/msteams/taskmodules/newcustomer',
        fallbackUrl: 'https://contoso.com/msteams/taskmodules/newcustomer',
      },
    },
  };
});

@app.on_message_ext_open
async def handle_fetch_task(
    ctx: ActivityContext[MessageExtensionFetchTaskInvokeActivity]
):
    card_info = CardTaskModuleTaskInfo(
        title="Example dialog",
        height="small",
        width="small",
        url="https://contoso.com/msteams/taskmodules/newcustomer",
    )

    task = TaskModuleContinueResponse(value=card_info)
    return MessagingExtensionActionInvokeResponse(task=task)

{
  "task": {
    "type": "continue",
    "value": {
      "title": "Dialog title",
      "height": 500,
      "width": "medium",
      "url": "https://contoso.com/msteams/taskmodules/newcustomer",
      "fallbackUrl": "https://contoso.com/msteams/taskmodules/newcustomer"
    }
  }
}

Solicitud para instalar el bot conversacional

Si la aplicación contiene un bot de conversación, instale el bot en la conversación y cargue el cuadro de diálogo. El bot es útil para obtener contexto adicional para el cuadro de diálogo. Un ejemplo de este escenario es capturar la lista para rellenar un control selector de personas o la lista de canales de un equipo.

Cuando la extensión de mensaje recibe la invocación de composeExtensions/fetchTask, compruebe si el bot está instalado en el contexto actual para facilitar el flujo. Por ejemplo, compruebe el flujo con una llamada de obtención de lista de participantes. Si el bot no está instalado, devuelva una tarjeta adaptable con una acción que solicite al usuario que instale el bot. El usuario debe tener permiso para instalar las aplicaciones en esa ubicación para la comprobación. Si la instalación de la aplicación no se realiza correctamente, el usuario recibe un mensaje para ponerse en contacto con el administrador.

Ejemplo

La siguiente sección de código es un ejemplo de la respuesta:

{
  "type": "AdaptiveCard",
  "body": [
    {
      "type": "TextBlock",
      "text": "Looks like you haven't used Disco in this team/chat"
    }
  ],
  "actions": [
    {
      "type": "Action.Submit",
      "title": "Continue",
      "data": {
        "msteams": {
          "justInTimeInstall": true
        }
      }
    }
  ],
  "version": "1.0"
}

Después de la instalación del bot conversacional, recibe otro mensaje de invocación con name = composeExtensions/submitAction, y value.data.msteams.justInTimeInstall = true.

Ejemplo

La siguiente sección de código es un ejemplo de la respuesta de la tarea a la invocación:

{
  "value": {
    "commandId": "giveKudos",
    "commandContext": "compose",
    "context": {
      "theme": "default"
    },
    "data": {
      "msteams": {
        "justInTimeInstall": true
      }
    }
  },
  "conversation": {
    "id": "19:7705841b240044b297123ad7f9c99217@thread.skype"
  },
  "name": "composeExtension/submitAction",
  "imdisplayname": "Bob Smith"
}

La respuesta de la tarea a la invocación debe ser similar a la del bot instalado.

Ejemplo

La siguiente sección de código es un ejemplo de instalación Just-In-Time de una aplicación con tarjeta adaptable:

using Microsoft.Teams.Cards;

// ...

var installCard = new AdaptiveCard
{
    Body = new List<CardElement>
    {
        new TextBlock("Looks like you haven't used Disco in this team/chat")
    },
    Actions = new List<Cards.Action>
    {
        new SubmitAction
        {
            Title = "Continue",
            Data = new Dictionary<string, object>
            {
                ["msteams"] = new Dictionary<string, object>
                {
                    ["justInTimeInstall"] = true
                }
            }
        }
    }
};

Ejemplo de código

Paso siguiente

Vea también

• Esquema del manifiesto de la aplicación de Teams
• Tarjetas
• Dialogs
• Definir comandos de acción de extensión de mensajería
• Extensiones de mensajes
• Selector de usuarios en Tarjetas adaptables
• Experiencia de configuración de bots