I'm developing an Angular + Flask application that uses Microsoft's OAuth2 (On-Behalf-Of-User Flow). I'm trying to call an API from the backend, but I get an exception.
Here is the configuration in app.module.ts:
export function MSALInstanceFactory(): IPublicClientApplication {
return new PublicClientApplication({
auth: {
clientId: '<application_id_of_spa>',
authority: 'https://login.microsoftonline.com/organizations',
redirectUri: 'http://localhost:4200/'
},
cache: {
cacheLocation: BrowserCacheLocation.LocalStorage,
storeAuthStateInCookie: isIE,
},
system: {
loggerOptions: {
loggerCallback,
logLevel: LogLevel.Info,
piiLoggingEnabled: false
}
}
});
}
export function MSALInterceptorConfigFactory(): MsalInterceptorConfiguration {
const protectedResourceMap = new Map<string, Array<string>>();
protectedResourceMap.set('https://graph.microsoft.com/v1.0/me', ['user.read']);
protectedResourceMap.set('https://api.powerbi.com/v1.0/myorg/', ['https://analysis.windows.net/powerbi/api/.default']);
protectedResourceMap.set('http://localhost:5000/api/v1.0/get_workspaces',['api://<application_id_of_webapi>/.default'])
return {
interactionType: InteractionType.Popup,
protectedResourceMap
};
}
export function MSALGuardConfigFactory(): MsalGuardConfiguration {
return {
interactionType: InteractionType.Popup,
authRequest: {
scopes: ['api://<application_id_of_webapi>/.default'],
},
};
}
Then I used acquireTokenPopup msal function to get an access token.
And then I call my backend API like this:
this.http.get('http://localhost:5000/api/v1.0/get_workspaces')
My Flask web API:
@app.route('/api/v1.0/get_workspaces', methods=['GET'])
def get():
current_access_token = request.headers.get("Authorization", None)
msal_client = msal.ConfidentialClientApplication(
client_id=app.config['CLIENT_ID'],
authority=app.config['AUTHORITY'],
client_credential=app.config['CLIENT_SECRET'])
# acquire token on behalf of the user that called this API
arm_resource_access_token = msal_client.acquire_token_on_behalf_of(
user_assertion=current_access_token.split(' ')[1],
scopes=app.config['SCOPE']
)
print( arm_resource_access_token) /////////////////// ******* I'm getting the error here
headers = {
'Authorization': arm_resource_access_token['token_type'] + ' ' + arm_resource_access_token['access_token']}
workspaces= requests.get(app.config['ENDPOINT'] + 'workspaces', headers = headers).json()
print(workspaces)
return jsonify(workspaces)
In my angular console, I'm getting this:
In my Flask terminal I'm getting this:
AADSTS65001: The user or administrator has not consented to use the application with ID <webapi_ app_id>.
In Azure portal, I registered both spa and web API:
I exposed the API on my backend, and added it in my frontend registration.
And I add my spa app_id on the Authorized client applications.
