Embedding a Report into a web page, easiest way

[Michele_Zanoni]

Hello all,

I'd like to ask advice on how to better be introduced into the world of embedding Power BI.

This is our current predicament: we have a database SQL on Azure and a Report+Dashboard built on that set of data. The next step will be to embed the report into the website of our company (or create one ad hoc). The fact is, we have little to no knowledge of php, html, javascript and the Power BI APIs. As first thing we gave a chance to Wordpress and a plug-in for Power BI, unfortunately we will need a little bit more customization. We are not afraid of getting our hands dirty, but we'd like advice on where to start. What is the quickest way from A (SQL on Azure + Power BI Report) to B (Report embedded into a webpage)? What documentation do you advise we study? Will we need to write lot of code, or will we be able to reverse engineer and start from something already written? If so, what?

Thanks in advance for your answers.

Michele

[az2451]

Hi Michele,

the easiest way i know to bind a report into a webpage is to publish them first and then bind it in your page by using an Iframe like so:

After you press on "Publish to web" you will get a code similar to this: 

<iframe width="800" height="600" src="https://app.powerbi.com/view?r=xxx" frameborder="0" allowFullScreen="true"></iframe>

This html-code you just have to paste in your webpage and youre ready to go.

Btw: you can resize it if you want by using the attributes width="800" and height="600"

Im not sure about the wp-plugin but i think thats not safe as you maybe have to offer your login-credentials to use the plug-in. I dont recommend to use it if its a third-party developer. Keep your data safe 🙂

[Nihar]

Hi

I have used Iframe to show the power bi report in mvc web application. The code is as below:

<iframe id="frame" width="800" height="600" src="https://msit.powerbi.com/reportEmbed?reportId=xxx" frameborder="0" allowFullScreen="true"></iframe>

After running the application, when i am trying to sign in to power bi, the following popup is getting displayed "The webpage you are trying to view is closing the tab. Do you want to close the tab". If i click on Yes or No, power bi report is loading in the web page instead of showing up in the iframe.

Can anyone suggest me what is the issue in this?

Thanks

Nihar

[Michele_Zanoni]

Hello az2451,

thank you for your answer. Unfortunately that is not a possibility for us. According to what Microsoft writes about the "Publish to web" functionality, they reserve the rights to show the data on search engines or use the data themselves. Since we are handling industrial data we simply can't tell our customers that Microsoft might decide to use their data, so publish to web is a no go for us. We are, I believe, forced to rely upon Power BI Embedded, but the learning curve, given our lack of knowledge of web apps, might be rather steep; that's why I am asking for any advice to make it as easy as possible to move the first steps into this world and maybe produce an initial result upon which we might later expand.

Michele

[az2451 · Accepted solution]

Hi Michele,

for your case i have found this blog-entry that sounds intresting: https://tsmatz.wordpress.com/2017/07/14/power-bi-embed-report-in-app/

[Michele_Zanoni]

Thank you for your answer. I have been working on it and managed to obtain decent results with it.

[npnigro]

We developed a plugin for WordPress to make this process easier if you use the "app owns data" method. See here: https://wordpress.org/plugins/embed-power-bi. 

[Anonymous]

@Michele_Zanoni : i am in the same boat and i am new to embedded and i know powerbi but not the embedded one . can you please help with some steps you followed and let me know if you connect me on this. If yes i can send private maessage  ?.