Integrera appar för arbetsytor i webbplatser och andra tjänster

  • Artikel
  • 3 minuter för att läsa

Apparna som du skapar är ofta mest användbara när de är tillgängliga just där människor utför sitt arbete. Genom att bädda in arbetysteappar i en iframe kan du integrera dessa appar på webbplatser och andra tjänster, t.ex. Power BI eller SharePoint.

I det här avsnittet, visar vi dig hur du ställer in parametrarna för app-inbäddning. Därefter bäddar vi in vår tillgångsbeställningsapp i en webbplats.

Power BI-instrumentpanel med inbäddad app.

Tänk på följande begränsningar:

  • Endast Power Apps-användare i samma klientorganisation kan komma åt den inbäddade appen.
  • Om du vill använda Power Apps med Internet Explorer 11 måste du inaktivera Kompatibilitetsvy.

Du kan också integrera arbetsyteappar i SharePoint Online (utan att använda en iframe). Mer information finns i: använd Power Apps webbdel

Ange URI-parametrar för din app

Om du har en app som du vill bädda in är det första steget att ange parametrarna för URI (Uniform Resource Identifier), så att iframe vet var appen finns. URI:en finns i följande format:

https://apps.powerapps.com/play/[AppID]?source=iframe

För GCC-användare

https://apps.gov.powerapps.us/play[AppID]?source=iframe

Viktigt

Från och med augusti 2019 har URI-formatet ändrats från https://web.powerapps.com/webplayer till https://apps.powerapps.com/play. Uppdatera inbäddade iframes om du vill använda det nya URI-formatet. Referenser till tidigare format omdirigeras till den nya URI:n för att säkerställa kompatibilitet.

Tidigare format:

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

Det enda du behöver göra är att ersätta ID för din app för [AppID] i URI:n (inklusive '[' & ']'). Vi visar dig snart hur du hämtar värdet, men först visar vi här alla parametrar i URI:en:

  • [appID] – Det innehåller ID för den app som ska köras.
  • tenantid – är en valfri parameter som stöder gäståtkomst och avgör vilken klient som ska öppna appen från.
  • screenColor – används för att ge en bättre appinläsningsupplevelse för dina användare. Den här parametern är i formatet RGBA (rött värde, grönt värde, blått värde, alfa) och kontrollerar skärmfärgen när appen har lästs in. Det är bäst att ställa in den på samma färg som för din apps ikon.
  • source – påverkar inte appen, men vi rekommenderar att du lägger till ett beskrivande namn för att referera till källan för inbäddningen.
  • Slutligen kan du lägga till eventuella anpassade parametrar du vill ha via Param()-funktionen, och dessa värden kan användas av din app. De läggs till i slutet av URI:en, exempelvis som [AppID]?source=iframe&param1=value1&param2=value2. Dessa parametrar är skrivskyddade när appen startas. Om du behöver ändra dem måste du starta om appen. Observera att endast det första objektet efter [AppID] bör ha ett "?"; efter detta används "&" som här.

Hämta app-ID

App-ID är tillgängligt på powerapps.com. För appen som du vill bädda in:

  1. I powerapps.com, på fliken Appar, klickar du eller trycker på knappen med tre punkter (... ), sedan Information.

    Gå till appinformation.

  2. Kopiera App-ID.

    Kopiera app-ID från detaljer.

  3. Ersätt värdet [AppID] i URI:en. För vår tillgångsbeställningsapp ser URI:en ut så här:

    https://apps.powerapps.com/play/76897698-91a8-b2de-756e-fe2774f114f2?source=iframe

Du kanske måste tillåta popup-fönster i webbläsaren när du bäddar in en app på webbplatsen där funktionen Launch() för att starta en webbsida eller en app.

Bädda in din app på en webbplats

Att bädda in din app är nu så enkelt som att lägga till iframe till HTML-koden för din webbplats (eller någon annan tjänst som stöder iframes, till exempel Power BI eller SharePoint):

<iframe width="[W]" height="[H]" src="https://apps.powerapps.com/play/[AppID]?source=website&screenColor=rgba(165,34,55,1)" allow="geolocation; microphone; camera"/>

Ange värden för iframe-bredd och -höjd och ersätt ID för din app med [AppID].

Anteckning

Inkludera allow="geolocation; microphone; camera" i din iframe-HTML-kod, så att dina appar kan använda dessa funktioner på Google Chrome.

Följande avbildning visar tillgångsbeställningsappen inbäddad i en Contoso-exempelwebbplats.

Contoso-webbplats med inbäddad app.

Tänk på följande för att autentisera användare av din app:

  • Om webbplatsen använder Azure Active Directory (AAD)-baserad autentisering, krävs ingen ytterligare inloggning.
  • Om din webbplats använder någon annan inloggningsmetod eller inte är autentiserad ser användarna en inloggningsuppmaning på iframe. När de loggar in kommer de att kunna köra appen så länge som appens skapare har delat appen med dem.

Som du kan se är inbäddningsappar enkla och kraftfulla. Med inbäddningar kan du överföra appar direkt till de platser som du och dina kunder arbetar på – i Power BI-instrumentpaneler och SharePoint-sidor.