Compilar guias para o Teams

As guias são páginas da Web com reconhecimento de cliente inseridas no Microsoft Teams, Outlook e Microsoft 365. Elas são marcas de <iframe/> HTML simples que apontam para domínios declarados no manifesto do aplicativo e podem ser adicionadas como parte de um canal dentro de uma equipe, chat em grupo ou aplicativo pessoal para um usuário individual. Você pode incluir guias personalizadas com seu aplicativo para inserir seu próprio conteúdo da Web no Teams ou adicionar funcionalidades específicas do Teams ao conteúdo da Web. Para obter mais informações, consulte Biblioteca de cliente JavaScript do Teams.

Importante

  • As guias personalizadas estão disponíveis na Nuvem da Comunidade Governamental (GCC), na GCC High, no Departamento de Defesa (DoD) e no Teams operado pela 21Vianet.

Há dois tipos de guias, guias estáticas e configuráveis. Essas guias podem ser utilizadas em três escopos distintos: personal, groupchate teams. As guias pessoais (estáticas), juntamente com os bots de escopo pessoal, fazem parte dos aplicativos pessoais com escopo para um único usuário e fixados na barra de navegação esquerda para facilitar o acesso. As guias pessoais (estáticas) no escopo pessoal continuam a funcionar da mesma maneira. No entanto, agora você pode estender guias estáticas para chats em grupo, canais ou reuniões com uma experiência personalizável.

As guias em chats, canais ou reuniões se comportam mais como aplicativos, pois você pode fixar apenas uma guia por aplicativo. Por exemplo, você pode fixar apenas uma única guia de aplicativo do YouTube em uma reunião. As guias estáticas em reuniões também podem ser pré-fixadas em reuniões por administradores de TI.

As imagens a seguir mostram guias adicionadas a diferentes contextos no Teams:

Área de trabalho do Teams

 A captura de tela mostra a guia adicionada a um escopo pessoal.

Teams para dispositivo móvel

O exemplo mostra uma guia móvel sendo adicionada em um contexto pessoal.

Veja a seguir alguns benefícios das guias estáticas em chats, canais e reuniões:

  • Fixável e instantâneo: você pode fixar aplicativos com guias estáticas do ícone adicionar uma guia + em chats, canais e reuniões. Essas guias podem ser desafixadas e não têm a caixa de diálogo de configuração obrigatória, que permite criar guias que funcionam mais como aplicativos.

  • Unificado: você pode criar uma guia estática que funciona em escopos pessoais e de grupo, como chat, canal e guias de reunião.

  • Configuração opcional: você pode alterar a URL padrão em sua instância de guia alterando a contentUrl propriedade do seu aplicativo depois que ele for fixado no Teams.

As guias de canal ou grupo , também conhecidas como guias configuráveis, fornecem conteúdo para canais e chats em grupo e são uma maneira de criar espaços colaborativos em torno de conteúdo dedicado baseado na Web.

A tabela a seguir ajuda a determinar o ajuste mais adequado para seu aplicativo:

  Personal Canais Chat em grupo Reuniões Chamando
Guias estáticas ✔️ ✔️ ✔️ ✔️ ✔️
Guias configuráveis ✔️ ✔️ ✔️

Observação

Se você tiver a guia configurável e a guia estática definidas no manifesto do aplicativo para um escopo específico, o Teams fixará a guia estática por padrão.

Você pode criar uma página de conteúdo como parte de uma guia estática pessoal, guia de canal ou grupo ou caixa de diálogo (referida como módulo de tarefa no TeamsJS v1.x). Você pode criar uma página de configuração que permite aos usuários configurar o aplicativo Microsoft Teams e usá-lo para configurar uma guia de chat pessoal, de canal ou em grupo, uma extensão de mensagens ou um card de conector para Grupos do Microsoft 365. Você pode permitir que os usuários reconfigurem sua guia após a instalação e criar uma página de remoção de guia para seu aplicativo. Ao criar um aplicativo do Teams que inclui uma guia, você deve testar como seu guia nos clientes do Teams para Android e iOS. Sua guia deve ter contexto por meio de informações básicas, informações de localidade e tema e entityId ou subEntityId que identifica o que está na guia.

Observação

Postagens e Arquivos que não podem ser movidos de suas posições.

Recursos da guia

Os recursos da guia são os seguintes:

  • Se uma guia for adicionada a um aplicativo que também tem um bot, o bot também será adicionado à equipe.
  • Reconhecimento do Microsoft Entra ID do usuário atual.
  • Reconhecimento de localidade para o usuário indicar o idioma en-us.
  • Funcionalidade de SSO (logon único), se houver suporte.
  • Capacidade de usar bots ou notificações de aplicativos para criar um link profundo para a guia ou para uma subentidade dentro do serviço, por exemplo, um item de trabalho individual.
  • A capacidade de abrir uma caixa de diálogo modal de links em uma guia.
  • Reutilização de Web Parts do SharePoint na guia.

Guias de cenários de usuário

Cenário: Traga um recurso web existente para o Teams.
Exemplo: Você cria uma guia estática em seu aplicativo do Teams que apresenta um site corporativo informativo aos usuários.

Cenário: Adicione páginas de suporte a um bot ou extensão de mensagens do Teams.
Exemplo: Você cria guias estáticas que fornecem conteúdo da página da Web eajudam aos usuários.

Cenário: Forneça acesso aos itens com os quais os usuários interagem regularmente para diálogo cooperativo e colaboração.
Exemplo: Você cria uma guia de canal ou grupo com vinculação profunda a itens individuais.

Declarar guia personalizada no manifesto do aplicativo

Uma guia personalizada é declarada no manifesto do aplicativo do pacote do aplicativo. Para cada página da web que você deseja incluir como uma guia em seu aplicativo, defina uma URL e um escopo. Além disso, adicione a biblioteca de clientes JavaScript do Teams à sua página e chame microsoftTeams.app.initialize() depois que a página for carregada. Isso informa ao Teams que o aplicativo foi carregado.

Se você optar por expor sua guia dentro do canal ou grupo, ou escopo pessoal, você deve apresentar uma página de <conteúdo HTML iframe> em sua guia. Para guias estáticas, a URL de conteúdo é definida diretamente no manifesto do contentUrl aplicativo do Teams pela propriedade na staticTabs matriz. O conteúdo da guia é o mesmo para todos os usuários.

Observação

Os aplicativos do Teams não podem usar plug-ins nativos porque são executados dentro de iframes em área restrita.

Para guias de canal ou grupo, você também pode criar uma página de configuração extra. Esta página permite configurar a URL da página de conteúdo, normalmente usando parâmetros de cadeia de caracteres de consulta de URL para carregar o conteúdo apropriado para esse contexto. Isso ocorre porque seu canal ou guia de grupo pode ser adicionado a várias equipes ou chats em grupo. Em cada instalação subsequente, os usuários podem configurar a guia, permitindo que você personalize a experiência conforme necessário. Quando os usuários adicionam ou configuram uma guia, uma URL é associada à guia apresentada na interface do usuário do Teams. A configuração de uma guia simplesmente adiciona mais parâmetros a essa URL. Por exemplo, quando você adiciona a guia Azure Boards, a página de configuração permite que você escolha qual placa a guia carrega. A URL da página de configuração é especificada pela propriedade na matriz no manifesto configurationUrlconfigurableTabsdo aplicativo.

Para guias estáticas, você pode fixar guias de contentUrl chat, canal ou reunião. Isso permite que você ignore a caixa de diálogo de configuração obrigatória e faça com que os usuários usem o aplicativo mais rapidamente. Você também pode alterar o contentUrl em tempo de execução. Isso permite que você crie um objeto de guia que funciona em todas as áreas de superfície do Teams. Para obter mais informações, consulte Migrar sua guia configurável para a guia estática.

Você pode ter vários canais ou guias de grupo e até 16 guias estáticas por aplicativo.

Criar um aplicativo de guia

Você pode criar um aplicativo de guia pessoal ou um aplicativo de guia configurável usando o Microsoft 365 Agents Toolkit (anteriormente conhecido como Teams Toolkit) ou Codespaces.

Para obter mais informações, consulte Criar seu aplicativo de guia básico.

Agora vamos criar sua guia. Mas primeiro selecione sua escolha de guia para compilar:

Próxima etapa

Confira também