Fournisseur de proxy

Lorsque vous utilisez un fournisseur proxy, vous pouvez utiliser votre authentification de serveur principal (telle que Auth2.0 flux On-Behalf-Of) pour démarrer la Boîte à outils Microsoft Graph en routant tous les appels vers Microsoft Graph via votre propre serveur principal.

Votre service de serveur principal doit exposer une API qui sera appelée pour chaque appel à Microsoft Graph. Par exemple, lorsqu’un composant tente d’obtenir une ressource, le fournisseur de proxy appellera à la place votre API de base et utilisera cette ressource.

https://graph.microsoft.com/v1.0/me => https://myurl.com/api/GraphProxy/v1.0/me

L’implémentation de votre API doit ensuite appeler Microsoft Graph au nom de l’utilisateur et renvoyer les résultats vers le composant.

Pour un exemple d’implémentation, voir Exemple ASP.NET MVC.

Pour en savoir plus sur les fournisseurs d’authentification, voir les fournisseurs.

Prise en main

Vous pouvez initialiser le fournisseur de proxy dans HTML ou JavaScript. Vous ne devez toutefois faire cela qu’une seule fois par page.

Initialiser dans votre page HTML

L’initialisation du fournisseur de proxy dans HTML est le moyen le plus simple pour définir votre propre route pour une authentification côté serveur personnalisée. Utilisez le composant mgt-proxy-provider pour définir graph-proxy-url. Cela configure le fournisseur de proxy défini en tant que fournisseur global.

<mgt-proxy-provider
  graph-proxy-url="https://myurl.com/api/GraphProxy"
></mgt-proxy-provider>
Attribut Description
graph-proxy-url URL de base pour l’API de proxy.

Initialiser dans JavaScript

Vous pouvez fournir d’autres d’options en initialisant le fournisseur dans JavaScript.

import { Providers } from "@microsoft/mgt-element";
import { ProxyProvider } from "@microsoft/mgt-proxy-provider";

Providers.globalProvider = new ProxyProvider(
  "https://myurl.com/api/GraphProxy"
);

Éventuellement, vous pouvez envoyer des en-têtes supplémentaires avec chaque demande à votre API de proxy en utilisant une fonction facultative en tant que second paramètre dans le constructeur.

import { Providers } from "@microsoft/mgt-element";
import { ProxyProvider } from "@microsoft/mgt-proxy-provider";

Providers.globalProvider = new ProxyProvider(
  "https://myurl.com/api/GraphProxy",
  async () => {
    return {
      header: "value",
      header2: "value2",
    };
  }
);

Cela est utile lorsque vous devez passer des jetons ou d’autres en-têtes à votre back-end.

Si vous allez utiliser le composant mgt-login, vous devrez également spécifier les fonctions login et logout pour le fournisseur :

import { Providers } from "@microsoft/mgt-element";
import { ProxyProvider } from "@microsoft/mgt-proxy-provider";

let provider = new ProxyProvider("https://myurl.com/api/GraphProxy");
provider.login = () => {
  /* will be called when "Sign In" is clicked */
};
provider.logout = () => {
  /* will be called when "Sign Out" is called */
};

Providers.globalProvider = provider;