As we all know that Power BI is a visualization tool used to create interactive reports. These reports can easily be seen in Power BI Service. But there is a restriction, if you want to show the report outside of the service, you need to go through a process to achieve this. Either, you can use Power BI rest API or you can use .NET SDK. In this section, we are going to discuss Power BI Rest API.

Register an Azure AD app to embed Power BI content

To get access to all Rest API of power BI for your application, you need to register an application with Microsoft Azure AD. It will create a unique identity and we need to define some permissions to Power BI rest resources. We can register an app in two different ways.

1. Register with the Power BI App Registration tool.
2. Register with Azure portal.

I am going to discuss both the ways.

Register with the Power BI App Registration tool

To register the app with Power BI App Registration tool, we need to follow these steps.

1. Go to this link https://dev.powerbi.com/apps

2. Sign In with your Microsoft account.

3. In the AppName, you need to provide app name; in my case it is Embedding Power BI.

4. You need to fill type of app whether your application is a native or server-side web app. In case of server-side app, you will get a client secret too.

5. Enter the value in Redirect Url and Home Page Url. It should be your application Url like
http://localhost:13526/Home

6. You need to set the permissions which you want to give to other users. This totally depends on you.

7. Click on Register App. You will get a client id and client secret. Save these values somewhere in your system. The complete process is shown below.

To grant all the permissions you need to go-

1. Go to azure portal

2. Go to App registrations

3. Select your app

4. Select Required permissions

5. Select power BI service and select Grant permissions

Register with Azure Portal

To register with azure portal-

1. Sign In into Azure portal

2. Go to Azure Active Directory and App registrations.

3. Within this, go to New Application Registration, fill all the details and create. You will see the client id.

4. To get the client secret, go into settings and then keys. You will get the secret key too and save this key in your system because it will show you one time only. After this, it will automatically hide.

5. To set the permissions, go to required permissions, set all the permissions.

Using Rest API to get the embed token

To get the embed token for a particular report, first, you will need an access token. This access token is nothing but a confirmation token from the Microsoft azure AD. To get the access token, you need to send the post request to this Url https://login.microsoftonline.com/common/oauth2/token

I am showing you all the API response in postman.

Step 1 Get access token (Post)

Use this API https://login.microsoftonline.com/common/oauth2/token (Post Request) like this:-

You need:

1. Client id which we have already discussed.

2. In grant_type you need to enter a password.

3. Your power BI credentials.

4. Resource url is https://analysis.windows.net/powerbi/api

You need to send all the data in url encoded form.

After hitting this API, you will get an access token and token type is Bearer.

Step 2: Get Report Details (Get Method)

To get all the reports you need to use this API

GET https://api.powerbi.com/v1.0/myorg/groups/{GROUP ID}/reports and we need to send the access token in the headers which will look like this.

In the API, you need to add the workspace id or group id both are the same thing. In response, we will get all the reports present in the workspace. In my workspace, there are two reports present which we can show in the response. We need embed url which we can easily see in the image above. If you open web url you will be redirected to the dashboard of power API.

Step 3 Get Embed token(Post Method)

This is our final step. To get the embed token, we need to pass some headers and parameters in the body. The API we are going to use here is

POST https://api.powerbi.com/v1.0/myorg/groups/{GROUP ID}/reports/{REPORT ID}/GenerateToken

In the body, we need to send accesslevel to view and you can see all the headers in the below image.

As shown above, you will see you get the embed token.

To generate the image we will need three values

1. Embed Token

2. Embed url

3. Report ID

And we successfully completed this.

Now, it’s time to test it. For testing, you can go through this link https://microsoft.github.io/PowerBI-JavaScript/demo/v2-demo/index.html#

I have entered all the fields which I have received in postman and hurray we got the report. We have successfully achieved the target. Cheers to us!!!!!!!!!!!!!
You can also test the report with code too.

<html>
<script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/jquery/dist/jquery.js"></script>
<script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/powerbi-client/dist/powerbi.js"></script>
<script type="text/javascript">

window.onload = function () {
var embedConfiguration = {
type: 'report',
accessToken: '{access_token}',
embedUrl: 'https://app.powerbi.com/reportEmbed?reportId={REPORT ID}&groupId={GROUP ID}',
id:'{REPORT ID}',
settings: {
{settings_ from link}
}
};
var $reportContainer = $('#dashboardContainer');
var report = powerbi.embed($reportContainer.get(0), embedConfiguration);
}

function reloadreport(){
var element = $('#dashboardContainer');
alert(element);
var report = powerbi.get(element);
report.reload().catch(error => {console.log(error) });
};
</script>
<div id="dashboardContainer"></div>
</html>




You will get the same output..

Conclusion

I have explained to you about how to embed reports into your application. This is just starting. There are so many APIs, which are provided by Microsoft Power BI. You can test all the APIs by yourself and to that, go to the documentation of Microsoft Power BI rest APIs. You can also add some security to your reports by adding some Row Level Security in power BI service. I hope you like this article. For any query, feel free to post your comment in the comment section. Thank you!

  •  
    2
    Shares
  • 2
  •  
  •  
  •  

LEAVE A REPLY

Please enter your comment!
Please enter your name here