Embed PowerApps on SharePoint Modern Pages

PowerApps can be embedded on pages, using an embed code.

  1. Go to web.powerapps.com and then click on your already existing app, to open it.
  2. On the File menu, click Share.
  3. Go to the Details tab.
    image
  4. Take a look at your App ID.  Copy it and put it over in Notepad, you’ll need it.
  5. Close PowerApps.
  6. Go to your SharePoint site where you’d like to embed this app.  Go to Site Settings.
  7. You need to be a site collection administrator for this part.  In Site Settings at the top level of your site collection, in the Site Collection Administration section, click HTML Field Security.
    Note that if you don’t see this setting in site collection admin, go to the SharePoint Admin Center –> Settings –> Custom Script, and you have to allow custom scripts.  This is a tenant level setting.
  8. In the box, Allow iframes from this domain, type this:
    web.powerapps.com
    click Add.  Click OK.
  9. Now, go to your homepage or whatever page you’d like to embed this.  It doesn’t even *have* to be a modern page.  At the top right of the page, click Edit.
  10. Insert the Embed web part.
    image
  11. In the web part properties on the right, use this code as your embed code, with your own App ID in there where it says AppID:

    image

  12. You’ll see your app on the page now, and you can Publish the page.

image

 

There’s even a parameter function that lets you pass parameters to your PowerApp.  https://powerapps.microsoft.com/en-us/tutorials/function-param/

You can even embed PowerApps in Power BI now as well: https://powerapps.microsoft.com/en-us/blog/embed-an-app/

Advertisements

4 comments

  • Hi Laura, Very nice Trick! Thanks ! Have one question though. In which Security Context the Webpart will run? Current User?

    Like

  • Doesn’t seem to work in Chrome. I get the following error: “Chrome detected unusual code on this page and blocked it to protect your personal information (for example, passwords, phone numbers, and credit cards).” ERR_BLOCKED_BY_XSS_AUDITOR

    Any suggestions?

    Like

  • Now it seems to work some of the time in Chrome but it is super tiny!

    Like

    • Consider defining the iframe size as px rather than % as when the iframe is displayed it will be scaled to fit by a transform function if the size is defined in %

      Like

Leave a reply or question

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s