How to use the Microsoft Identity Platform with Angular Application | MSAL | Entra ID | SPA

[@legionsman7476]

if you added app roles to the client or api and you want to return each users role, how do you go about that?

[@legionsman7476]

and what if you had multiple API scopes? i have 2: user.read and a custom one called access.user. when i tried to add multiple scopes, i would never be able to display the roles from the access.user scope.

[@LearnWithJon]

Thank you for watching. I assume you have already correctly added those scopes in "EntraID > App Registrations > API Permissions". The next step you need to take is to add them in the environment config. In my sample project, it is located at "frontend-angular/src/environments/environment.dev.ts". I would look like this: apiConfig: { scopes: ['user.read','access.user'], ..... } I hope this helps. Have a nice day ahead.

[@sumangeorge7]

On refresh the site is giving below result "The connection for this site is not secure localhost sent an invalid response."

[@LearnWithJon]

@sumangeorge7 Thank you for watching my video. Unfortunately, I didn't encounter this on my end. Have you checked my git repo for the source code of this demo project? github.com/ryanninodizon/msal-angular17-with-listdata or tried my own Azure Developer CLI template? azure.github.io/awesome-azd/?name=Azure+Serverless

[@arshadmujawar2432]

@LearnWithJon Hi , the video was very helpful thanks I have one question why build is have postinstall : msal what is significance of it ? Is it madantory ?

[@LearnWithJon]

Hello, Thank you for watching my video. Microsoft Authentication library is the one who do the magic for you for making the authorization/authentication working. You need to install that dependency. ' See more details about MSAL here: learn.microsoft.com/en-us/entra/msal/overview Thanks again and have a nice day ahead.

[@arshadmujawar2432]

Hi , i was asking like why we are running that tarball.js script while building the app since we have the dep in package json already , msal browser and angular . Correct me if i am thinking in wrong way

[@LearnWithJon]

@@arshadmujawar2432 ah that one. you can ignore that. That is being used for your local dependencies. When you deploy your app to PROD. you dont need that. Thats why when you visit my git repo for this sample project. this is located to a different folder github.com/ryanninodizon/msal-angular17-with-listdata/tree/main/sample-scripts

[@arshadmujawar2432]

Ohk ohk thanks I got it .

[@varshask3231]

Inprogress$ not available error iam getting what do I do😮

[@LearnWithJon]

Thank you for watching my video. Is that error coming from angular? Have you installed angular dependencies before running the app? Check the source code for this demo here: github.com/ryanninodizon/msal-angular17-with-listdata Hope it helps. Have a nice day.

[@FUNc4l4v3r4]

is quite hard to follow without any commentary

[@LearnWithJon]

Thank you for watching as well as giving feedback. I will use this to make my future video more helpful. You can use the timestamp so you can go directly to the part that you might like to see right away or watch my other video related to this: kzbin.info/www/bejne/Z2m2Y2yCZ7Jrq5o

[@FUNc4l4v3r4]

@@LearnWithJon yeah time timedtamps are good

[@LearnWithJon]

@@FUNc4l4v3r4 thanks again for watching and have a nice day ahead.

[@mharadaily]

Helpful ❤

[@강삼순-n2f]

Thank You.

[@LearnWithJon]

You're welcome. Thank you for watching.