topic Re: How to embed a PowerBI.com report into cloud app (quickbase)? in Developer

How to embed a PowerBI.com report into cloud app (quickbase)?

belmore — Thu, 09 Feb 2017 16:36:28 GMT

I use Quickbase as a cloud platform to build Cloud Apps and Power BI as my BI platform. I would like to integrate/embed my Power BI reports into my Quickbase applications. My goal would be to embed using the PowerBI.com API vs. Power BI embedding services. Is this possible to do? I appreciate any help/advice.

Re: How to embed a PowerBI.com report into cloud app (quickbase)?

Eric_Zhang — Fri, 10 Feb 2017 11:13:52 GMT

belmore wrote:

I use Quickbase as a cloud platform to build Cloud Apps and Power BI as my BI platform. I would like to integrate/embed my Power BI reports into my Quickbase applications. My goal would be to embed using the PowerBI.com API vs. Power BI embedding services. Is this possible to do? I appreciate any help/advice.

PowerBI.com API and Power BI embedding are both compatible to almost any web application(.NET is typically recommended). Whether it is possible to embed Power BI report in your case is all depending on quickbase side. I don't know about your quickbase, so I'd suggest you post an question on the quickbase community.

By the way, check github libraries for embeding reports via PowerBI.com API and Power BI embedded.

Power BI Emebedded

Power BI REST API

Re: How to embed a PowerBI.com report into cloud app (quickbase)?

belmore — Fri, 10 Feb 2017 15:17:24 GMT

v-lvzhan, thank you for your reply. I'm confident that it is possible to embed within quickbase....I had no issues with embedding Tableau dashboards and reports....the only requirement was that a quickbase user must also have a Tableau online license....so in order to view the tableau report within quickbase the user a) must already had been signed into tableau online or b) login to tableau through the embedded tableau report.

I get lost when it comes to registering a web-app? I'm not sure how best to complete the form....since Quickbase is not My app.....any advice would be greatly appreciated here....App Type:, Redirect URI:, Home Page:

App Name:

App Type:

Redirect URI:

Home Page:

I believe if I can set this up correctly...then I have a chance at getting this to work. Thank you

Re: How to embed a PowerBI.com report into cloud app (quickbase)?

Eric_Zhang — Tue, 21 Feb 2017 12:41:54 GMT

The simplist way to embed power bi can be using a static HTML. "Registering a web-app" is to get the the accessToken that is used to embed. Here's the embeded sample .

As to the web-app, I started from this page Step 1: Register an app with Azure AD.

<html lang="en">
<head> 
    <script type="text/javascript">

        window.onload = function () {
		
		updateEmbedTile(); 
        };

        var width = 500;
        var height = 500; 

        // update embed tile
        function updateEmbedTile() {
            // check if the embed url was selected
            var embedTileUrl = "https://msit.powerbi.com/embed?dashboardId=f1f5155b-c6e2-4147-991b-28d914927d05&tileId=50de3c3a-2e8c-49bd-ada4-18d0b1e19415";
            if ("" === embedTileUrl)
                return;

            // to load a tile do the following:
            // 1: set the url, include size.
            // 2: add a onload handler to submit the auth token
            iframe = document.getElementById('iFrameEmbedTile');
            iframe.src=embedTileUrl + "&width=" + width + "&height=" + height;
            iframe.onload = postActionLoadTile;
        }

        
        // post the auth token to the iFrame. 
        function postActionLoadTile() {
            // get the access token.
            accessToken = "YOURTOKENHERE";

            // return if no a
            if ("" === accessToken)
                return;

            var h = height;
            var w = width; 

            // construct the push message structure
            var m = { action: "loadTile", accessToken: accessToken, height: h, width: w};
            message = JSON.stringify(m);

            // push the message.
            iframe = document.getElementById('iFrameEmbedTile');
            iframe.contentWindow.postMessage(message, "*");;
        }

    </script>
</head>
<body>

<iframe ID="iFrameEmbedTile" src="" height="500px" width="500px" frameborder="0" seamless></iframe>

<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
    {"appName":"Chrome","requestId":"ab3c9a4238164ad2bb8954672a5a9399"}
</script>
<script type="text/javascript" src="http://localhost:37067/ed3b2d1937bc4b06bd06d5ce0d652d66/browserLink" async="async"></script>
<!-- End Browser Link -->

</body>
</html>

Re: How to embed a PowerBI.com report into cloud app (quickbase)?

belmore — Fri, 24 Feb 2017 18:47:08 GMT

Thank you for your help. This is all a little above my head. It would be GREAT.....if I could leverage ( http://docs.powerbi.apiary.io/# ) to generate the embedding code. I can use the Apiary app the see a list of reports within my PowerBI.com account.....It would be super to select a report and have the Apiary app generate the embedding code.

Thanks again

Re: How to embed a PowerBI.com report into cloud app (quickbase)?

Eric_Zhang — Sun, 26 Feb 2017 06:40:34 GMT

belmore

I'd suggest you use this MSDN documentation, it would be more up to date.