Compartilhar via


Adicionar suporte de imagem embutida no chat de interoperabilidade do Teams

Com o Chat de Interoperabilidade do Teams, ou Interop Chat, você pode permitir que os usuários dos Serviços de Comunicação do Azure recebam imagens embutidas enviadas por usuários do Teams. Quando você habilita um editor de rich text, os usuários dos Serviços de Comunicação do Azure podem enviar imagens embutidas aos usuários do Teams. Para obter mais informações, consulte casos de uso da Biblioteca de Interface do Usuário.

O recurso nos Serviços de Comunicação do Azure para receber imagens embutidas vem com a composição CallWithChat sem configuração extra. Para habilitar o recurso nos Serviços de Comunicação do Azure para enviar imagens embutidas, defina richTextEditor como true em CallWithChatCompositeOptions.

Important

O recurso nos Serviços de Comunicação do Azure para enviar imagens embutidas está atualmente em versão prévia.

Versões prévias das APIs e dos SDKs são fornecidas sem um contrato de nível de serviço. É recomendável que você não as use para cargas de trabalho de produção. Talvez não haja suporte para alguns recursos, ou os recursos podem ser limitados.

Para saber mais, consulte os Termos de Uso Complementares das Versões Prévias do Microsoft Azure.

Código de download

Para acessar o código deste tutorial, confira o artigo de Exemplos do Azure no GitHub Biblioteca de IU - Chat de Interoperação do Teams.

Prerequisites

Background

O Chat de Interoperabilidade do Teams deve fazer parte de uma reunião existente do Teams. Quando o usuário do Teams cria uma reunião online, uma conversa de chat é criada e associada à reunião. Para habilitar o usuário final dos Serviços de Comunicação do Azure ingressando no chat e começando a enviar/receber mensagens, um participante da reunião (um usuário do Teams) precisa admiti-los na chamada primeiro. Caso contrário, eles não têm acesso ao chat.

Depois que o usuário final dos Serviços de Comunicação do Azure for admitido na chamada, ele poderá começar a conversar com outros participantes na chamada. Este artigo descreve como funciona o compartilhamento de imagens embutidas no chat de Interoperabilidade do Teams.

Overview

Como você precisa ingressar em uma reunião do Teams primeiro, use a composição ChatWithChat da Biblioteca de IU.

Para criar uma ChatWithChat composição, siga o exemplo no tutorial CallWithChatComposite.

No código de exemplo, é necessário CallWithChatExampleProps, que é definido como o seguinte snippet de código:

export type CallWithChatExampleProps = {
  // Props needed for the construction of the CallWithChatAdapter
  userId: CommunicationUserIdentifier;
  token: string;
  displayName: string;
  endpointUrl: string;
  locator: TeamsMeetingLinkLocator | CallAndChatLocator;

  // Props to customize the CallWithChatComposite experience
  fluentTheme?: PartialTheme | Theme;
  compositeOptions?: CallWithChatCompositeOptions;
  callInvitationURL?: string;
};

Nenhuma configuração específica é necessária para habilitar o recebimento de imagens embutidas. Mas para enviar imagens embutidas, a função richTextEditor deve ser habilitada por meio de CallWithChatExampleProps. Aqui está um snippet de código sobre como habilitar isso:

<CallWithChatExperience
  // ...any other call with chat props
  compositeOptions={{ richTextEditor: true }}
/>

Para iniciar a composição para o chat da reunião, você precisa passar TeamsMeetingLinkLocator, que é semelhante a:

{ "meetingLink": "<TEAMS_MEETING_LINK>" }

Nenhuma outra configuração é necessária.

Executar o código

Vamos executar npm run start. Em seguida, você pode acessar o aplicativo de exemplo por meio de localhost:3000.

Captura de tela que mostra uma Biblioteca de interface do usuário dos Serviços de Comunicação do Azure.

Selecione o botão de chat localizado na parte inferior do painel para abrir o painel de chat. Agora, se um usuário do Teams enviar uma imagem, você deve ver algo semelhante à seguinte captura de tela.

Captura de tela que mostra a Biblioteca de interface do usuário dos Serviços de Comunicação do Azure recebendo duas imagens embutidas.

Quando o recurso para enviar imagens embutidas estiver habilitado, você deverá ver algo semelhante à captura de tela a seguir.

Captura de tela que mostra a Biblioteca de interface do usuário dos Serviços de Comunicação do Azure enviando duas imagens embutidas e editando mensagens.

Problemas conhecidos

  • A Biblioteca de interface do usuário pode não dar suporte a determinadas imagens GIF no momento. O usuário pode receber uma imagem estática.
  • A Biblioteca de interface do usuário da Web não dá suporte a clipes (vídeos curtos) enviados por usuários do Teams no momento.
  • Para determinados dispositivos Android, só há suporte para colar uma única imagem quando você segura o editor de rich text e seleciona Colar. Talvez não haja suporte para a seleção no modo de exibição da área de transferência usando o teclado.

Próxima etapa