PowerBi-Javascript report embedding cluster details 403 error

Question

I'm trying to display a power bi report in a typescript app.

I've successfully obtained an access token from AAD, and can in fact use it via the power bi rest api. I'd like to be able to use PowerBi-Javascript, for cleanliness and being able to apply filters. But I'm receiving a 403 error each time on a call to https://api.powerbi.com/powerbi/globalservice/v201606/clusterdetails, saying 'TokenExpired' - even when the token is freshly generated and should be valid for at least an hour.

The code to embed the report looks like this:

private embedReport(accessToken: string): powerBiClient.Embed {
  const element = this.getDisplayElement();
  const reportId = this.getReportId();
  const config = {
    type: 'report',
    id: reportId,
    tokenType: powerBiClient.models.TokenType.Aad,
    accessToken: accessToken
  };
  return this.powerBiService.embed(element, config);

getDisplayElement returns the appropriate HTMLElement, getReportId the id of the report to display, powerBiClient is the powerbi-javascript import, and powerBiService is an instance of powerBiClient.service.Service.

I've attempted this with reports I own, and with reports in a group (adding the groupId to the config).

How can I fix this error?

Answer 1

I had the same issue, switching tokenType to - models.TokenType.Embed worked successfully.

Answer 2

It looks like you are missing the embedUrl option in the config (see this example from the documentation). This is returned from the Power BI REST API, for example in the get reports API.