Delen via

Ondersteuning voor inlineafbeeldingen toevoegen in Teams-interoperabiliteit-chat

Met Teams Interoperability Chat of Interop Chat kunt u Azure Communication Services-gebruikers in staat stellen inlineafbeeldingen te ontvangen die door Teams-gebruikers worden verzonden. Wanneer u een rtf-editor inschakelt, kunnen Azure Communication Services-gebruikers inlineafbeeldingen verzenden naar Teams-gebruikers. Zie gebruiksvoorbeelden voor ui-bibliotheek voor meer informatie.

De functie in Azure Communication Services voor het ontvangen van inline-afbeeldingen is beschikbaar met de CallWithChat composiet zonder extra installatie. Om de functie in Azure Communication Services voor het verzenden van inline afbeeldingen in te schakelen, stel richTextEditor in op true onder CallWithChatCompositeOptions.

Belangrijk

De functie in Azure Communication Services voor het verzenden van inline afbeeldingen is momenteel in preview.

Preview-API's en SDK's worden verstrekt zonder een service level agreement. We raden aan om ze niet voor productie-werkbelastingen te gebruiken. Sommige functies worden mogelijk niet ondersteund of mogelijkheden zijn mogelijk beperkt.

Voor meer informatie, bekijk Aanvullende Gebruiksvoorwaarden voor Microsoft Azure-voorbeelden.

Download code

Zie het artikel UI Library van Teams Interop Chat voor toegang tot de code voor deze zelfstudie in GitHub Azure Samples.

Prerequisites

Background

Teams Interop Chat moet deel uitmaken van een bestaande Teams-vergadering. When the Teams user creates an online meeting, a chat thread is created and associated with the meeting. Als u wilt dat de eindgebruiker van Azure Communication Services deelneemt aan de chat en berichten begint te verzenden/ontvangen, moet een deelnemer aan de vergadering (een Teams-gebruiker) deze eerst aan het gesprek toelaten. Otherwise, they don't have access to the chat.

Zodra de eindgebruiker van Azure Communication Services is toegelaten tot het gesprek, kan deze beginnen met chatten met andere deelnemers aan het gesprek. In dit artikel wordt beschreven hoe inline delen van afbeeldingen werkt in Teams Interop-chat.

Overview

Omdat u eerst moet deelnemen aan een Teams-vergadering, maakt u gebruik van de composiet uit de ChatWithChat UI-bibliotheek.

Als u een ChatWithChat samengestelde groep wilt maken, volgt u het voorbeeld in de zelfstudie CallWithChatComposite.

In de voorbeeldcode heeft het CallWithChatExampleProps nodig, dat wordt gedefinieerd als het volgende codefragment:

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

Er is geen specifieke installatie nodig om het ontvangen van inline afbeeldingen mogelijk te maken. Maar om inline afbeeldingen te verzenden, moet de richTextEditor functie worden ingeschakeld via CallWithChatExampleProps. Hier is een codefragment om het in te schakelen:

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

To start the composite for meeting chat, you need to pass TeamsMeetingLinkLocator, which looks like this:

{ "meetingLink": "<TEAMS_MEETING_LINK>" }

Er is geen verdere installatie nodig.

Voer de code uit

Laten we npm run start uitvoeren. Dan kunt u toegang krijgen tot de voorbeeld-app via localhost:3000.

Schermafbeelding die de Azure Communication Services UI-bibliotheek toont.

Selecteer de chatknop die zich onderaan het venster bevindt om het chatvenster te openen. Nu, als een Teams-gebruiker een afbeelding verstuurt, zou u iets zoals de volgende screenshot moeten zien.

Screenshot die laat zien dat Azure Communication Services UI Library twee inline afbeeldingen ontvangt.

Wanneer de functie voor het verzenden van inlineafbeeldingen is ingeschakeld, zou je iets moeten zien dat lijkt op de volgende schermafbeelding.

Schermafbeelding die laat zien hoe de Azure Communication Services UI Library twee inline afbeeldingen verstuurt en berichten bewerkt.

Bekende problemen

  • UI Library biedt mogelijk op dit moment geen ondersteuning voor bepaalde GIF-afbeeldingen. De gebruiker kan in plaats daarvan een statisch beeld ontvangen.
  • De web UI Bibliotheek ondersteunt momenteel geen clips (korte video's) die door Teams-gebruikers worden verzonden.
  • For certain Android devices, pasting a single image is supported only when you hold down the rich text editor and select Paste. Selecteren vanuit de klembordweergave met behulp van het toetsenbord wordt mogelijk niet ondersteund.

Next step

Controleer de rest van de UI-bibliotheek