The app is asking for consent twice in "app calls api" scenario

I'm using two app registrations and implement the "expose an api" scenario. My CLIENT_APP is an angular application using msal-angular library. My SERVER_APP is a .NET server that's using "Expose an API" feature and defines a scope. It also lists CLIENT_APP as a trusted client application.

CLIENT_APP is actually doing most of the heavy lifting in the system and it accesses Azure AD directly using a directory.read.all. The SERVER_APP provides settings API and is only interested in knowing the users identity.

My problem is that while doing the initial sign up the users are asked for consent for the CLIENT_APP to "View profile" and "Maintain access". That's ok, but immediately after I make a server API call to get settings I'm getting another consent window asking again asking for permissions for CLIENT_APP - "View profile" and "Maintain access". However, there's a paragraph in the window: "If you accept, SERVER_APP will also have access to your user profile information."

Is there a way to do this consent thing in one step? It feels like a very confusing user experience (especially when signing in for the first time)

I tried to reproduce the same in my environment and got the results like below:

I created an Azure AD Client App and added API permissions:

I created an Azure AD Server App and Exposed an API like below:

Note that: It is inappropriate to get consent screen twice. The user must get the consent screen only once.

For sample, I tried to authorize users by using below endpoint:

https://login.microsoftonline.com/TenantID/oauth2/v2.0/authorize?
&client_id=ClientID
&response_type=code
&redirect_uri=https://jwt.ms
&response_mode=query
&scope=api://AppID/test.read Directory.Read.All
&state=12345

When I tried to sign-in with the user account, I got the consent once as below:

After consenting, user successfully got redirected to the redirect page like below:

If still the issue persists, try the below:

• Configure same API permissions for the Client App and the Server App and try.
• Another approach is you can generate access token for Microsoft Graph and fetch the user profile by using the access token like below:

https://graph.microsoft.com/v1.0/users/UserID

• It is not possible to call two APIs at a time.
• Try using the one Azure AD App for authorizing users.
• You can also make use of On-Behalf Flow to resolve the issue.