Power BI Embed token refresh

I have embedded a PowerBI report using 'User owns data' concept. It's working as expected.

After 60 minutes the token expires regardless of user is active on the report or not. I added a setInterval of 50 minutes, which basically gets the new token and sets in the existing report.

Getting the token on angular component init.


initPbiChart() {
this.pbiService
.login()
.then((r: any) => {
this.pbiService
.getAccessToken()
.then((res: any) => {
const accessToken = res.accessToken;
this.accessToken = accessToken;

this.embedConfig = {
type: 'report',
embedUrl: AppModule.APP_CONFIG.reportConfig.reportUrl as string,
accessToken: accessToken,
tokenType: models.TokenType.Aad,
settings: {
filterPaneEnabled: true,
navContentPaneEnabled: false,
layoutType: models.LayoutType.Custom,
customLayout: {
displayOption: models.DisplayOption.FitToWidth,
},
},
};
})
.catch((err: any) => {
console.log('error', err);
});
})
.catch((e: any) => {
console.error(
'Login Error: Please make sure your popup blocker is disabled'
);
});
}

Refresh token on interval


ngOnInit(): void {
if (AppModule.APP_CONFIG.featureFlag.slaDashboard != 'true') {
this.router.navigate(['mn-business-tracker']);
}
this.initPbiChart();
this.interval = setInterval(() => {
this.getNewAccessToken();
}, interval);
}
...
getNewAccessToken() {
return this.pbiService.login().then((r: any) => {
this.pbiService.getAccessToken().then((res: any) => {
this.accessToken = res.accessToken;
this.reportObj.getReport().setAccessToken(this.accessToken);
});
});
}

PowerBI Service


...
login() {
return this.msalInstance.loginPopup({
scopes: ['https://analysis.windows.net/powerbi/api/Report.Read.All'],
});
}

getAccessToken() {
return this.msalInstance.acquireTokenSilent({
scopes: ['https://analysis.windows.net/powerbi/api/Report.Read.All'],
});
}
...


This does not work. After checking an hour later sometimes I see the login popup window is there with blank content. Sometimes there is no popup window for login, but if I interact with report, it shows Token Expired error.

What is the best practice to refresh access token of power bi embedded reports in angular using powerbi-client-angular?

Continue reading...