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

[rush2kasi6401]

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:

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]

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]

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

[bapat-atharva]

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]

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]

@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

[bapat-atharva]

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]

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: @.***>