Udostępnij przez

Dodaj obsługę obrazów w formacie inline w czacie interop w Teams.

W przypadku czatu współdziałania usługi Teams lub czatu międzyopowego można umożliwić użytkownikom usług Azure Communication Services odbieranie wbudowanych obrazów wysyłanych przez użytkowników usługi Teams. Po włączeniu edytora tekstu sformatowanego użytkownicy usług Azure Communication Services mogą wysyłać obrazy wbudowane do użytkowników usługi Teams. Aby uzyskać więcej informacji, zobacz Przypadki użycia biblioteki interfejsu użytkownika.

Funkcja w Azure Communication Services umożliwiająca odbieranie obrazów w linii jest dostępna z kompozytem CallWithChat bez dodatkowej konfiguracji. Aby włączyć funkcję w Azure Communication Services dla wysyłania wbudowanych obrazów, ustaw richTextEditor na true w ramach CallWithChatCompositeOptions.

Important

Funkcja w Azure Communication Services umożliwiająca wysyłanie obrazów w linii jest obecnie w wersji zapoznawczej.

API i zestawy SDK w wersji zapoznawczej są dostarczane bez umowy na poziomie usług. Zalecamy, aby nie używać ich do obciążeń produkcyjnych. Niektóre funkcje mogą nie być obsługiwane lub mogą być ograniczone.

Aby uzyskać więcej informacji, zapoznaj się z Dodatkowymi Warunkami Korzystania z Microsoft Azure Previews.

Pobieranie kodu

Aby uzyskać dostęp do kodu na potrzeby tego samouczka, zobacz artykuł GitHub Azure Samples Biblioteka - Teams Interop Chat.

Prerequisites

Background

Czat interoperacyjny Teams musi być częścią istniejącego spotkania Teams. Kiedy użytkownik Teams tworzy spotkanie online, generowany jest wątek czatu, który zostaje powiązany ze spotkaniem. Aby umożliwić użytkownikowi końcowemu usług Azure Communication Services dołączanie do czatu i rozpoczynanie wysyłania/odbierania wiadomości, uczestnik spotkania (użytkownik usługi Teams) musi najpierw przyznać je do połączenia. W przeciwnym razie nie mają dostępu do czatu.

Gdy użytkownik końcowy usług Azure Communication Services zostanie przyjęty do połączenia, może rozpocząć rozmowę z innymi uczestnikami połączenia. W tym artykule opisano, jak działa udostępnianie obrazów w linii w czacie interoperacyjnym usługi Teams.

Overview

Aby najpierw dołączyć do spotkania w Teams, skorzystaj z komponentu ChatWithChat z biblioteki interfejsu użytkownika.

Aby utworzyć złożony element ChatWithChat, postępuj zgodnie z przykładami w samouczku CallWithChatComposite.

Z przykładowego kodu wynika, że potrzebne jest CallWithChatExampleProps, które jest zdefiniowane w następującym fragmencie kodu.

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

Nie jest potrzebna żadna specjalna konfiguracja, aby umożliwić odbieranie obrazów w tekście. Aby wysyłać obrazy w treści wiadomości, funkcja richTextEditor musi być włączona poprzez CallWithChatExampleProps. Oto fragment kodu, jak to włączyć:

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

Aby rozpocząć składnik do czatu spotkania, musisz przekazać TeamsMeetingLinkLocator, który wygląda tak:

{ "meetingLink": "<TEAMS_MEETING_LINK>" }

Nie jest potrzebna żadna dodatkowa konfiguracja.

Uruchom kod

Uruchommy npm run start. Następnie możesz uzyskać dostęp do przykładowej aplikacji za pośrednictwem localhost:3000.

Zrzut ekranu przedstawiający bibliotekę interfejsu użytkownika Azure Communication Services.

Wybierz przycisk czatu znajdujący się na dole panelu, aby otworzyć panel czatu. Teraz, jeśli użytkownik Teams wyśle obraz, powinieneś zobaczyć coś podobnego do poniższego zrzutu ekranu.

Zrzut ekranu przedstawiający Bibliotekę UI Usług Komunikacyjnych Azure odbierającą dwa wbudowane obrazy.

Gdy funkcja wysyłania obrazów w treści wiadomości jest włączona, powinieneś zobaczyć coś podobnego do poniższego zrzutu ekranu.

Zrzut ekranu przedstawiający bibliotekę interfejsu użytkownika Azure Communication Services wysyłającą dwa osadzone obrazy i edytującą wiadomości.

Znane problemy

  • Biblioteka UI może obecnie nie obsługiwać niektórych obrazów GIF. Użytkownik może otrzymać zamiast tego statyczny obraz.
  • Biblioteka interfejsu użytkownika sieci web nie obsługuje klipów (krótkich filmów) wysyłanych przez użytkowników Teams w tym momencie.
  • W przypadku niektórych urządzeń z systemem Android wklejanie pojedynczego obrazu jest obsługiwane tylko w przypadku przytrzymania edytora tekstu sformatowanego i wybraniu pozycji Wklej. Wybieranie z widoku schowka za pomocą klawiatury może nie być obsługiwane.

Następny krok

Sprawdź resztę biblioteki UI

  • Last updated on