Authenticate users in JavaScript apps with MSAL.js

Ғылым және технология

Check out our complete playlist focused on Identity • Develop JavaScript app...
The Microsoft Authentication Library (MSAL) is the critical enabler for any developer who wants to connect to the Microsoft Identity Platform, acquire a token, and then use that token to access secure APIs.
• In this session, we will “start from scratch” by going over the basics of the Microsoft Identity Platform and how to get a token using HTTP requests and a browser manually.
• We will then show how the MSAL.js library makes it very easy to acquire and renew tokens for your apps.
github.com/MSUSDEV/microsoft_...
Subscribe to our newsletter aka.ms/DevRadioSource

Пікірлер: 56

  • @goelliego
    @goelliego3 жыл бұрын

    Really Liked the manual method to explain slowly for beginners. Best tutorial so far on the getting started with the topic.

  • @Terry-404
    @Terry-4043 жыл бұрын

    Lol - that "header" typo had me screaming at the screen "It's right there!"

  • @jaimemnds

    @jaimemnds

    3 жыл бұрын

    DAMN HEADES

  • @gimperdaniel

    @gimperdaniel

    3 жыл бұрын

    this always happens when you are a presenter

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    Yea, it stressed me out looking back

  • @briancoder7621
    @briancoder76213 жыл бұрын

    Excellent tutorial. MSAL is very useful. Thank you.

  • @itsmeinspiron
    @itsmeinspiron3 жыл бұрын

    Thank you for this walk through, very easy to digest - great job Sidney!

  • @vish86in
    @vish86in3 жыл бұрын

    Great video!! waiting for Authenticating to Azure with MSAL.js

  • @Ziggy0120
    @Ziggy01202 жыл бұрын

    this is an excellent video! I have to implement authentication using azure for a work project without ever having done it before. thank you!

  • @PatrickSierak
    @PatrickSierak3 жыл бұрын

    Thank you for this video :)

  • @agamesta4
    @agamesta42 жыл бұрын

    thank you very much , it work with me after more time in search

  • @GapBruno360
    @GapBruno3602 жыл бұрын

    This is great, thank you!

  • @harsh21289
    @harsh212893 жыл бұрын

    Great video.. thanks!!

  • @pawelpisarski4740
    @pawelpisarski47403 жыл бұрын

    Great tutorial! When are the other parts of this series going to be available?

  • @sidney-andrews

    @sidney-andrews

    3 жыл бұрын

    There are more videos on the channel now

  • @tushaar9027
    @tushaar9027 Жыл бұрын

    Excellent tutorial , can you please show using pkce as well as it is going to be become standard pretty soon

  • @KlrStng
    @KlrStng3 жыл бұрын

    Thank you for this video, it is helpful. As of 1/26/21, the manual step to acquire a token (at ~28:00) now requires the client secret as well as the client id and the code.

  • @MicrosoftDevRadio

    @MicrosoftDevRadio

    3 жыл бұрын

    Thanks for calling that out. We'll have to do a refresh of this video in the not too distant future. Appreciate the help keeping up with the changes in Azure!

  • @carloolleres5237

    @carloolleres5237

    3 жыл бұрын

    I did create an application secret for the specific application however I'm receiving a Request malformed error

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    Moving forward, I would recommend using MSAL 2x which doesn’t require the secret or implicit grant.

  • @jasonthorpe3470
    @jasonthorpe34702 жыл бұрын

    Great Stuff! I have a request though, Can you post links to the other videos in this series in the description?

  • @MicrosoftDevRadio

    @MicrosoftDevRadio

    2 жыл бұрын

    thanks for calling that out. I've added a link to the complete playlist

  • @randompointlessness2766
    @randompointlessness27663 жыл бұрын

    I ve been using adal.js but since we migrate to .net 5.0 it gives me errFailed while on microsoft authentication page redirection won't work so I assume I have to use MSAL.js

  • @aashayamballi
    @aashayamballi3 жыл бұрын

    Thanks for the great demo. I just had one question. If I have a single page app or a native app and a backend API (django rest) completely independen of each other. In my case if my single page app/native apl wants to access certain data from backend API. And inorder to access the API, user should be logged in the backend API. So what my approch is to make use of MSAL library to get the access token from the SPA/native app and then once token is acquired, pass that token to backend API, validate it, get the user info from graph api, if user is exists in the DB login the user and pass the required info. If user info doesn't exist then create the user, login and pass the info from API. So my question is when I pass the access token to backend api. How can we validate that the token which we passed to backend API is valid token or not? Is it just we need to make an API call to graph API? if it is able to get the user data then token is valid or if it fails then the token is invalid. Is it the general way to validate the token or some better approach is there? Please help

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    Yes, you should look at the “on-behalf-of” workflow for the API: docs.microsoft.com/en-us/azure/active-directory/develop/msal-authentication-flows#on-behalf-of Basic idea is to perform an interactive workflow on the front-end, then pass in your token as a bearer token to the back-end. The API can then use your token to get its own token on behalf of you, the user.

  • @_boraprogramar

    @_boraprogramar

    Жыл бұрын

    Do you manage to do that way? I'm trying to do The same

  • @carloolleres5237
    @carloolleres52373 жыл бұрын

    Hi, I'm faced with an error of URL Malformed even after providing a Client Secret to the form data sent at the tutorial time 28:00, anybody experienced the same error?

  • @dvijhay78
    @dvijhay783 жыл бұрын

    How do you get data from Sharepoint lists using msal.js, do you have any tutorials.

  • @kanakarajunaiduthota2417
    @kanakarajunaiduthota24173 жыл бұрын

    can we create or update SharePoint list item using MSAL who have read-only access on the SharePoint?

  • @thingsiwishiknew8592
    @thingsiwishiknew859210 ай бұрын

    Hi there love the video , quick question, how would this change if i wanted to use a certificate instead of a secret

  • @ashishnarkhede3637
    @ashishnarkhede36373 жыл бұрын

    The slide at 23.04 shows that the refresh token is supposed to be in the response. But in the Postman demo at 28.16, there is no refresh token? Was it a typo in the slide?

  • @sidney-andrews

    @sidney-andrews

    3 жыл бұрын

    Yes, thanks for calling that out

  • @jlumley
    @jlumley Жыл бұрын

    does this work if your app is in an .

  • @nagacse66
    @nagacse663 жыл бұрын

    Msal refreshtoken method not working consistent

  • @cleanbowledyt
    @cleanbowledyt Жыл бұрын

    great tutorial...thanks for this one....however is there any api that would help me to logout the signed in user Please share the same if you happen to know about it

  • @danielbenedik4659
    @danielbenedik46592 жыл бұрын

    this is SSO connection with Azure?

  • @verplife6137
    @verplife61373 жыл бұрын

    To me, there is nothing worse than seeing a microsoft sign in page knowing the user will not know what that is and be confused because all they want to do is log into my site. I would get so many calls, if I implemented this on my company page, regarding if they have been hacked or went to the wrong site, etc. This is a deal breaker for me.

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    You can apply custom branding to the sign-in page. It’s pretty in-depth and you can change a lot of components. Azure AD B2C takes it further by supporting custom CSS. But one note that trips everyone up: If you redirect people to the “common” tenant, you will get default Microsoft branding because Azure AD doesn’t know if you are going to use an org or personal account. If you redirect to the “organizations” tenant, Azure AD can make educated guesses, but it still won’t apply corp branding because it doesn’t know which org the user will select. Redirect users directly to your tenant using your GUID so users will see your branding immediately and won’t be confused by the Microsoft branding.

  • @oyinbrakemimichaelmenebray5966
    @oyinbrakemimichaelmenebray59662 жыл бұрын

    Is it possible to get the user profile with out clicking the button. Please help, because I'm trying to get the user information using the on compose message event handler.

  • @MicrosoftDevRadio

    @MicrosoftDevRadio

    2 жыл бұрын

    Feel free to send mail to msusdev@microsoft.com and we'll try to help

  • @oyinbrakemimichaelmenebray5966

    @oyinbrakemimichaelmenebray5966

    2 жыл бұрын

    @@MicrosoftDevRadio thanks, I'll do that now. Hoping to get a feedback soon

  • @MicrosoftDevRadio

    @MicrosoftDevRadio

    2 жыл бұрын

    @@oyinbrakemimichaelmenebray5966 I haven't seen the mail come through, just fyi.

  • @oyinbrakemimichaelmenebray5966

    @oyinbrakemimichaelmenebray5966

    2 жыл бұрын

    I sent the mail immediately after I replied your message

  • @oyinbrakemimichaelmenebray5966

    @oyinbrakemimichaelmenebray5966

    2 жыл бұрын

    I sent the email with my outlook account. Can you please check your spam messages. Thanks

  • @diptanusaha6597
    @diptanusaha65973 жыл бұрын

    How to make mgt components work on top of this - can anyone help ?

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    We just released a video on the MGT components today on this channel

  • @gmil12345
    @gmil123452 жыл бұрын

    contrary to what this video says there doesn't appear to be anyone answering emails to the address advised... which is a real shame as as soon as you try to do anything not out-the-box with B2C it's like walking in treacle

  • @MicrosoftDevRadio

    @MicrosoftDevRadio

    2 жыл бұрын

    Feel free to send me mail directly at macalde@microsoft.com if you're not getting through using msusdev@microsoft.com

  • @nikhilramabhadra6052
    @nikhilramabhadra60523 жыл бұрын

    Is it possible to avoid the content in the index.js file client I'd etc? Everything is in plain text. This information will be seen in the browser dev tools by anybody. Am I right? It doesn't feel right. Is it not possible to have the login page served from the server and then have the React app load?

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    The OAuth spec says that the client ID is not a secret so you shouldn’t worry about storing that in plain text: tools.ietf.org/html/rfc6749#section-2.2 However, client secrets and credentials should absolutely be secured.

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    For some additional context, information like the authority, scope, and client ID are present in the URL when you login as plain text. None of it is a secret, and none of it is enough for someone to get access to your system. If it’s an interactive login, they still need to login on the webpage (username+password, or device). In an unattended scenario, they still need a secret or certificate (which you should absolutely secure). Does that explanation help?

  • @nikhilramabhadra6052

    @nikhilramabhadra6052

    2 жыл бұрын

    @@sidney-andrews Isn't the AAD URL present in JavaScript an issue? DOS attack on AAD?

  • @sidney-andrews

    @sidney-andrews

    2 жыл бұрын

    @@nikhilramabhadra6052 Azure has DDOS protection already integrated into services on the platform. There is a separate paid service if you want DDOS for applications you built.

  • @nikhilramabhadra6052

    @nikhilramabhadra6052

    2 жыл бұрын

    @@sidney-andrews After ChaosDb, Azurescape, and such issues how much faith do you have in MS DDOS protection? 🤔

Келесі