microsoft / powerbi-client-angular

Power BI Angular component. This library lets you embed Power BI report, dashboard, dashboard tile, report visual, or Q&A in your Angular application.
Other
135 stars 65 forks source link

Gov Cloud Reports are not rendering in Angular Component due to CROS issue #38

Closed rush2kasi6401 closed 1 week ago

rush2kasi6401 commented 1 year ago

We have reports in app.powerbigov.us (Gov cloud) and embed url also having https://app.powerbigov.us/reportEmbed?reportId=.... However, angular failed to load report due to cros issue.

Here is Network traffic results: image

What I have observed is call in going to below URL failed. But why we have Referer: https://app.powerbi.com/ for the below URL instead of https://app.powerbi.com/ Due to this I suspect CROS issue. Why this is happening?

Request URL: https://wabi-us-gov-iowa-redirect.analysis.usgovcloudapi.net/explore/reports/1a1f947a-e0de-4cf8-a645-27f22730f6d4/conceptualschema?userPreferredLocale=en-US

Appreciate your feedback.

bapat-atharva commented 1 year ago

Hi @rush2kasi6401,

The powerbi-service should be able to automatically detect the environment you are trying to embed with. Can you let us know how you are generating the embed-url and the access-token ? Can you also let us know the request body where the referrer is app.powerbi.com ?

rush2kasi6401 commented 1 year ago

We are using the following code to set the token (Service Priciple) and Embed Url.

try { // reportConfigResponse = await this.pbiService.getEmbedConfig().toPromise(); forkJoin( [ this.pbiService.getEmbedTripsConfig()] ).subscribe( ([res]) => { reportConfigResponse = res } ).add(() => { // Update the reportConfig to embed the PowerBI report this.reportTripsConfig = { ...this.reportConfig, id: reportConfigResponse.Id, embedUrl: reportConfigResponse.EmbedUrl, accessToken: reportConfigResponse.EmbedToken.token }; });

    } catch (error: any) {
      this.displayMessage = `Failed to fetch config for report. Status: ${error.status} ${error.statusText}`;
      console.error(this.displayMessage);
      return;
    }

Here is the API code to get token [HttpGet] [Route("api/PbiAuth/EmbedReportConfig")] public async Task EmbedReportConfig() { var embedResult = await m_embedService.EmbedReport(); if (embedResult) { return m_embedService.EmbedConfig; } else { return m_embedService.EmbedConfig; } }

We don't have an issue generating token or getting embed url.

Here is the embed URL: https://app.powerbigov.us/reportEmbed?reportId=1a1f947a-e0de-4cf8-a645-27f22730f6d4&groupId=531ebe59-d47a-4846-87ec-61fe1790de34&w=2&config=eyJjbHVzdGVyVXJsIjoiaHR0cHM6Ly9XQUJJLVVTLUdPVi1JT1dBLXJlZGlyZWN0LmFuYWx5c2lzLnVzZ292Y2xvdWRhcGkubmV0IiwiZW1iZWRGZWF0dXJlcyI6eyJtb2Rlcm5FbWJlZCI6dHJ1ZSwidXNhZ2VNZXRyaWNzVk5leHQiOnRydWV9fQ%3d%3d

However, getting below failures and failed to load report. I am confused, why referer is having: https://app.powerbi.com image

bapat-atharva commented 1 year ago

Thank you for the information. I am assuming you are using the correct environment config for authenticating and making requests to powerbi similar to here. We will check and let you know if we find anything.

rush2kasi6401 commented 1 year ago

This issue we have noticed for the applications which we migrated from Angular 10 to 14. Similar CROS issues from 2 different applications. However, we are able to successfully integrate a new brand angular 14 application. I hope this information may be helpful for resolve/analyse the issue further.

Here is the screenshot from a different application.

[image: image.png]

On Tue, May 2, 2023 at 12:22 AM Atharva Bapat @.***> wrote:

Thank you for the information. I am assuming you are using the correct environment config for authenticating and making requests to powerbi similar to here https://github.com/microsoft/PowerBI-Developer-Samples/blob/master/.NET%20Framework/Embed%20for%20your%20organization/CloudConfigs/Power%20BI%20US%20Government/Cloud.config . We will check and let you know if we find anything.

— Reply to this email directly, view it on GitHub https://github.com/microsoft/powerbi-client-angular/issues/38#issuecomment-1530855196, or unsubscribe https://github.com/notifications/unsubscribe-auth/AN7LAGP7QATERSFL3D7ILZDXECDZ7ANCNFSM6AAAAAAXRHXTZA . You are receiving this because you were mentioned.Message ID: @.***>

rush2kasi6401 commented 1 year ago

@bapat-atharva - Here is more information on how we successfully embedded a sample commercial cloud dashboard. Whereas gov cloud report failed to embed due to CROS Issue as shown in below figures

image

image

bapat-atharva commented 1 year ago

Thank you @rush2kasi6401 for getting back with more information. We were able to embed using the US gov environment when we tried to, but we need to check for when migrating from Angular 10 to 14.

As I understand you were able to embed in a brand new Angular 14 application, so I am not sure if the issue lies with the package. We will update if we find anything.

rush2kasi6401 commented 1 year ago

Today I noticed the applications which failed to embed are having below calls from network traffic. As mentioned initially our embedConfig attribute clearly https://app.powerbigov.us.. but the actual call is going to https://app.powerbi.com/reportEmbed?uid=. https://app.powerbi.com/reportEmbed?uid=...

Will this give you any idea?

[image: image.png]

[image: image.png]

On Fri, May 5, 2023 at 3:13 AM Atharva Bapat @.***> wrote:

Thank you @rush2kasi6401 https://github.com/rush2kasi6401 for getting back with more information. We were able to embed using the US gov environment when we tried to, but we need to check for when migrating from Angular 10 to 14.

As I understand you were able to embed in a brand new Angular 14 application, so I am not sure if the issue lies with the package. We will update if we find anything.

— Reply to this email directly, view it on GitHub https://github.com/microsoft/powerbi-client-angular/issues/38#issuecomment-1535824083, or unsubscribe https://github.com/notifications/unsubscribe-auth/AN7LAGPKKWIXOC2XVIBSYHTXESSAXANCNFSM6AAAAAAXRHXTZA . You are receiving this because you were mentioned.Message ID: @.***>

v-MadhavC commented 1 month ago

Thank you for reporting this issue. This is an old issue, is it still relevant?

ayeshurun commented 1 week ago

The issue is closed since no response was received.