I'm using the PowerBI REST API along with ADAL.js and getting Dashboards. I want to embed a Dashboard in an IFrame. I'm using Angular.JS
So what did was something like this. Notice I have used "*" as the IFrame Target Origin. dashboardEmbedUrl is obtained from the API call
<iframe id="PBDashboard" ng-show="dashboardVisible" src="{{dashboardEmbededUrl}}" frameborder="0" style="height: 100vh; width: 100%"></iframe>
and in my controller
var iframe = document.getElementById("PBDashboard")
const loadIframeDashboardEventListner = function() {
const token = localStorage.getItem('adal.access.token.keyhttps://analysis.windows.net/powerbi/api');
iframe.contentWindow.postMessage(JSON.stringify({
action: "loadDashboard",
accessToken: token
}), "*") //target is *. what should be the specific URL needed here
}
and
iframe.addEventListener("load",loadIframeDashboardEventListner);
This works perfectly fine but using "*" triggers a security warning in SonarCloud. It says to specify a target. I'm not sure what the target should be. The API call also gives a webUrl along with the embedUrl. I used the webUrl instead of the "*" and it rendered the IFrame data but also gave the following error in console
