Partager via


Service relais Azure Fluid personnalisé


Bien que vous préfériez probablement utiliser notre service hébergé gratuit, il existe des situations où il est avantageux d’utiliser votre propre service Relais Azure Fluid pour votre application Live Share.

Conditions préalables

  1. Créez un panneau latéral de réunion et une extension de réunion d’application de phase, comme indiqué dans le didacticiel sur les rouleaux de dés.
  2. Mettez à jour le manifeste de votre application pour inclure toutes les autorisations nécessaires.
  3. Provisionnez un service Relais Azure Fluid comme indiqué dans ce tutoriel.

Se connecter au service Relais Azure Fluid

Lorsque vous appelez l’initialisation LiveShareClient, vous pouvez définir votre propre AzureConnectionConfig. Live Share associe les conteneurs que vous créez à des réunions, mais vous devez implémenter l’interface ITokenProvider pour signer des jetons pour vos conteneurs. Cet exemple explique azure AzureFunctionTokenProvider, qui utilise une fonction cloud Azure pour demander un jeton d’accès à un serveur.

import { LiveShareClient, LivePresence } from "@microsoft/live-share";
import { LiveShareHost } from "@microsoft/teams-js";
import { SharedMap } from "fluid-framework";
import { AzureFunctionTokenProvider } from "@fluidframework/azure-client";

// Define a custom connection for your app
const options = {
  connection: {
    tenantId: "MY_TENANT_ID",
    tokenProvider: new AzureFunctionTokenProvider(
      "MY_SERVICE_ENDPOINT_URL" + "/api/GetAzureToken",
      { userId: "userId", userName: "Test User" }
    ),
    endpoint: "MY_SERVICE_ENDPOINT_URL",
    type: "remote",
  },
};
// Join the Fluid container
const host = LiveShareHost.create();
const liveShare = new LiveShareClient(host, options);
const schema = {
  initialObjects: {
    presence: LivePresence,
    ticTacToePositions: SharedMap,
  },
};
const { container } = await liveShare.joinContainer(schema);

// ... ready to start app sync logic

Pourquoi utiliser un service Relais Azure Fluid personnalisé ?

Envisagez d’utiliser une connexion de service AFR personnalisée si vous :

  • Exiger le stockage des données dans des conteneurs Fluid au-delà de la durée de vie d’une réunion.
  • Transmettre des données sensibles via le service qui nécessite une stratégie de sécurité personnalisée.
  • Développez des fonctionnalités via Fluid Framework pour votre application en dehors de Teams.

Pourquoi utiliser Live Share avec votre service personnalisé ?

Relais Azure Fluid est conçu pour fonctionner avec n’importe quelle application web, ce qui signifie qu’il fonctionne avec ou sans Microsoft Teams. Cela soulève une question importante : si je crée mon propre service Relais Azure Fluid, ai-je toujours besoin de Live Share ?

Live Share propose des fonctionnalités qui sont utiles pour les scénarios de réunion courants qui augmentent d’autres fonctionnalités dans votre application, notamment :

Mappage de conteneurs

Le LiveShareClient dans @microsoft/live-share est chargé de mapper un identificateur de réunion unique à vos conteneurs Fluid, ce qui garantit que tous les participants à la réunion rejoignent le même conteneur. Dans le cadre de ce processus, le client tente de se connecter à un containerId mappé à la réunion qui existe déjà. S’il n’en existe pas, le AzureClient est utilisé pour créer un conteneur à l’aide de votre AzureConnectionConfig , puis relayer le à d’autres participants à la containerId réunion.

Si votre application dispose déjà d’un mécanisme permettant de créer des conteneurs Fluid et de les partager avec d’autres membres, par exemple en insérant dans containerId l’URL partagée à la phase de réunion, cela peut ne pas être nécessaire pour votre application.

Vérification des rôles et des objets en direct

Les structures de données actives de Live Share telles que LivePresence, LiveStateet LiveEvent sont adaptées à la collaboration dans les réunions et ne sont donc pas prises en charge dans les conteneurs Fluid utilisés en dehors de Microsoft Teams. Des fonctionnalités telles que la vérification des rôles aident votre application à s’aligner sur les attentes de nos utilisateurs.

Remarque

En outre, les objets en direct présentent également des latences de message plus rapides que les structures de données Fluid traditionnelles.

Pour plus d’informations, consultez la page fonctionnalités principales .

Utiliser Live Share sans LiveShareClient

Vous pouvez toujours utiliser Live Share même si vous utilisez ne souhaitez pas utiliser la LiveShareClient classe pour votre service Relais Azure Fluid personnalisé. Cela est utile si vous souhaitez contrôler quand un conteneur est créé ou comment il est partagé avec les participants à la réunion.

Voici un exemple de la façon dont vous pouvez procéder dans votre application :

import {
  LiveShareClient,
  LivePresence,
  getLiveShareContainerSchemaProxy,
} from "@microsoft/live-share";
import { SharedMap } from "fluid-framework";
import {
  AzureFunctionTokenProvider,
  AzureClient,
} from "@fluidframework/azure-client";
import { LiveShareHost } from "@microsoft/teams-js";

// Define a custom connection for your app
const options = {
  connection: {
    tenantId: "MY_TENANT_ID",
    tokenProvider: new AzureFunctionTokenProvider(
      "MY_SERVICE_ENDPOINT_URL" + "/api/GetAzureToken",
      { userId: "userId", userName: "Test User" }
    ),
    endpoint: "MY_SERVICE_ENDPOINT_URL",
    type: "remote",
  },
};
// Initialize your AzureClient instance
const client = new AzureClient(options);
// Define your Fluid schema
const schema = {
  initialObjects: {
    presence: LivePresence,
    ticTacToePositions: SharedMap,
  },
};
// Create your host
const host = LiveShareHost.create();
// Create the LiveShareRuntime, which is needed for `LiveDataObject` instances to work
const runtime = new LiveShareRuntime(this._host);
// Inject the LiveShareRuntime dependency into the ContainerSchema
const injectedSchema = getLiveShareContainerSchemaProxy(
    schema,
    runtime,
);
// Create (or get) your container
const { container } = await client.createContainer(injectedSchema);

// ... ready to start app sync logic

Vous pouvez également utiliser ou remplacer .AzureLiveShareHost Cela vous permet d’obtenir des noms d’affichage et des rôles d’utilisateur personnalisés à partir de votre AzureAudience, plutôt que via Microsoft Teams.

import {
  LiveShareClient,
  LivePresence,
  AzureLiveShareHost,
  getLiveShareContainerSchemaProxy,
} from "@microsoft/live-share";
import { SharedMap } from "fluid-framework";
import {
  AzureFunctionTokenProvider,
  AzureClient,
} from "@fluidframework/azure-client";

// Define a custom connection for your app
const options = {
  connection: {
    tenantId: "MY_TENANT_ID",
    tokenProvider: new AzureFunctionTokenProvider(
      "MY_SERVICE_ENDPOINT_URL" + "/api/GetAzureToken",
      { userId: "userId", userName: "Test User" }
    ),
    endpoint: "MY_SERVICE_ENDPOINT_URL",
    type: "remote",
  },
};
// Initialize your AzureClient instance
const client = new AzureClient(options);
// Define your Fluid schema
const schema = {
  initialObjects: {
    presence: LivePresence,
    ticTacToePositions: SharedMap,
  },
};
// Create your AzureLiveShareHost
const host = AzureLiveShareHost.create();
// Create the LiveShareRuntime, which is needed for `LiveDataObject` instances to work
const runtime = new LiveShareRuntime(this._host);
// Inject the LiveShareRuntime dependency into the ContainerSchema
const injectedSchema = getLiveShareContainerSchemaProxy(
    schema,
    runtime,
);
// Create (or get) your container
const { container } = await client.createContainer(injectedSchema);
// Set AzureAudience into the AzureLiveShareHost
host.setAudience(services.audience);

// ... ready to start app sync logic

De nombreuses API Live Share dépendent d’une API d’horodatage global, qui permet LiveDataObject aux objets de déterminer l’ordre des messages distants. Si vous utilisez des structures de données qui s’appuient sur la TimestampProvider classe , vous devez utiliser le LiveShareHost à partir de la teams-js bibliothèque ou remplacer la getTimestamp() fonction dans AzureLiveShareHost par une valeur retournée par votre serveur.

Voir aussi