Roland Oldengarm - Independent IT Contractor

Living in the coolest little capital Wellington, New Zealand!

Part 2: Embed a Power BI Report in a SharePoint Site

This is part 2 of the blog post series: How to embed a Power BI Report in SharePoint. Please check Part 1, where I’ve shown how to embed a Power BI report in a provider hosted add-in. In this part I will show you how this report can be added to SharePoint as a custom web part. I’ve also improved the solution I built in Part 1, for example it’s also possible to embed an entire report, and not only one tile. All source code is on GitHub.

Let’s start with the great end result!

How it works is:

  • A PowerBI user opens the provider hosted add-in, and logs in.
  • After logging in, he selects either a report, or a tile.
  • Finally, he clicks “Embed in SharePoint”. A web part is then added to the web part gallery with all required scripts.
  • A SharePoint content editor can then add this web part to any site.

Please note that this is not using the new Power BI Embedded. My solution uses the embed URL, which still requires a user to log in, such that an access token can be sent along with the request for the report. The Power BI Embedded service released recently solves this issue. Maybe in a next post I will dive into that.

The Power BI Embedded service and the report embed URL’s are two completely different things

Allow to select a Power BI report to be embedded

In Part 1 I’ve shown you how to embed a Power BI Tile to a page. Some people asked if it’s possible to embed dashboards and reports as well. Unfortunately it is not possible to embed entire dashboards, but it is possible to embed a report. So, I’ve added a drop down list to the default.aspx page that allows you to select a report, and I’ve added logic to display that in an iframe. The JavaScript to send through the token is slightly different, but in general it works the same as embedding a live tile.

Embed the script into a SharePoint site

And now the most fun part: Add the web part to a SharePoint site. I’ve copied some of the code from the excellent DevPNP example that adds a web part to the host web with some custom script. What I do is:

  • Grab the selected report (it can be extended easily to work with report tiles)
  • Grab the base web part definition for a script editor web part.
  • Populate the content property with the required HTML and JavaScript.
  • Upload the web part to the web part gallery in the host web.

When a user has done this the following message should be shown:

Next, click on the Host web link to go back to SharePoint. Edit the page, go to Insert > Web Part and see the result of this magic:

If you click Add, you should see the report you’ve selected earlier.

Some caveats

My solution is not perfect. There are some issues that should prevent you from using this in production environments:

  • The access token of the user adding the Power BI report is in the HTML page, available to any user. This is a security concern.
  • The web part is so powerful, that in random cases after adding it to a page, the entire page stays white (I think it has something to do with MDS).
  • In the provider hosted add-in, the SharePoint context is lost after logging into PowerBI. You need to click back and refresh to continue.

Please feel free to improve my solution, or provide feedback what you would like to see next in this space. Comments are welcome!

5 Comments

  1. Thank you for a nice tutorial.
    I made it a bit different, I used this code from MS — https://azure.microsoft.com/en-us/documentation/articles/power-bi-embedded-get-started-sample/
    implemented that code into Sharepoint add-in and secured it with tokens, so right now users can see reports when they press on application, and it’s secure, because it uses tokens and doesn’t require any logins.
    Just curious how to implement that app inside sharepoint page, right now it goes into another tab.
    I am waiting for a third tutorial, it’s a lack of solutions how to implement it in SP, while it’s new thing. Huge thanks!

  2. Hi, everyone

    I successfully implemented the solution but when i close the browser or i open the SharePoint site the next day, the report is not shown. I got the message “this content is unavailable!!”. Any idea what this could be? Thanks in advance

    • rolandoldengarm

      August 9, 2016 at 3:18 pm

      Is this message coming from Power BI? Is the report still available? Have you tried to add the report again?

      • Hi Roland, yes this message comes from PowerBI, the report is still available and I tried several times adding the report again but no luck and after that my SharePoint site crashes and i can’t edit the page

Leave a Reply

Your email address will not be published.

*