Les applications que vous développez sont souvent plus utiles lorsqu’elles sont disponibles à l’endroit même où les utilisateurs travaillent. PowerApps vous permet d’incorporer des applications dans un iframe. Vous pouvez ainsi les intégrer dans des sites web et d’autres services, tels que Power BI ou SharePoint.

Dans cette rubrique, nous allons vous montrer comment définir des paramètres d’incorporation d’application. Ensuite, nous verrons comment incorporer notre application de commande de ressources dans un site web.

Tableau de bord Power BI avec une application intégrée

Gardez à l’esprit les restrictions suivantes :

  • Seuls les utilisateurs PowerApps dans le même locataire peuvent accéder à l’application incorporée.
  • Pour accéder à PowerApps à l’aide d’Internet Explorer 11, vous devez désactiver l’affichage de compatibilité.

Vous pouvez également intégrer PowerApps dans SharePoint Online (sans utiliser un iframe). Pour en savoir plus, consultez la page Générer une application à partir de SharePoint à l’aide de PowerApps.

Définir les paramètres URI pour votre application

Si vous possédez une application que vous souhaitez incorporer, la première étape consiste à définir les paramètres pour l’Uniform Resource Identifier (URI), afin que l’iframe sache où trouver l’application. L’URI se présente sous la forme suivante :

https://web.powerapps.com/webplayer/iframeapp?source=iframe
&appId=/providers/Microsoft.PowerApps/apps/[AppID]

Remarque : nous avons ajouté un saut de ligne pour que l’URI s’affiche mieux sur la page.

Il vous suffit de remplacer l’ID de votre application par [AppID] dans l’URI (y compris les caractères « [ » et « ] »). Nous allons vous montrer comment obtenir rapidement cette valeur. Avant toute chose, voici les paramètres disponibles dans l’URI :

  • [appID] est au format /providers/Microsoft.PowerApps/apps/[AppID]. Il s’agit de l’ID de l’application à exécuter.
  • screenColor sert à fournir une meilleure expérience de chargement d’application pour vos utilisateurs. Ce paramètre est au format RGBA (rouge, vert, bleu, alpha), et définit la couleur de l’écran pendant le chargement de l’application. Il est préférable de définir la même couleur que l’icône de votre application.
  • source n’affecte pas l’application. Cependant, nous vous conseillons d’ajouter un nom descriptif pour faire référence à la source de l’incorporation.
  • Enfin, vous pouvez librement ajouter les paramètres personnalisés de votre choix à l’aide de la fonction Param (), et ces valeurs peuvent être utilisées par votre application. Ils sont ajoutés à la fin de l’URI, de la façon suivante : [AppID]&param1=value1. Ces paramètres sont en lecture seule lors du démarrage de l’application. Si vous avez besoin de les modifier, redémarrez l’application.

Obtenir l’ID de l’application

L’ID de l’application est disponible sur powerapps.com. Pour l’application que vous souhaitez incorporer :

  1. Dans powerapps.com, dans l’onglet Applications, cliquez ou appuyez sur les points de suspension ( ), puis sur Détails.

    Accédez aux détails de l’application.

  2. Copiez l’ID de l’application.

    Copiez l’ID de l’application à partir des détails.

  3. Remplacez la valeur [AppID] dans l’URI. Pour notre application de commande de ressources, l’URI ressemble à ceci :

    https://web.powerapps.com/webplayer/iframeapp?hideNavBar=true&
    source=iframe&appId=/providers/Microsoft.PowerApps/apps/76897698-91a8-b2de-756e-fe2774f114f2
    

Intégrer votre application dans un site web

Il est maintenant aussi simple d’incorporer votre application que d’ajouter l’iframe au code HTML de votre site (ou tout au service prenant en charge les iframes, tel que Power BI ou SharePoint):

<iframe width="[W]" height="[H]" src="https://web.powerapps.com/webplayer/iframeapp?hideNavBar=true&
source=website&screenColor=rgba(165,34,55,1)&appId=/providers/Microsoft.PowerApps/apps/[AppID]"/>

Spécifiez des valeurs pour la largeur et la hauteur de l’iframe, et remplacez l’ID de votre application par [AppID].

L’image suivante montre l’incorporation de l’application de commande de ressources dans un exemple de site web Contoso.

Site web Contoso avec application incorporée

Gardez les points suivants à l’esprit pour l’authentification des utilisateurs de votre application :

  • Si votre site web utilise l’authentification basée sur Azure Active Directory (AAD), aucune connexion supplémentaire n’est requise.
  • Si votre site web utilise tout autre mécanisme de connexion, ou s’il n’est pas authentifié, vos utilisateurs voient une invite de connexion sur l’iframe. Une fois qu’ils sont connectés, ils peuvent exécuter l’application, tant que l’auteur de celle-ci la partage avec eux.

Comme vous pouvez le voir, l’incorporation d’applications est simple et puissante. Elle vous permet d’apporter des applications à l’endroit même où vous et vos clients travaillez, dans des sites web, des tableaux de bord Power BI, des pages SharePoint et bien plus encore.