Code Monkey home page Code Monkey logo

ms-identity-javascript-tutorial's Introduction

page_type languages products description urlFragment
sample
javascript
msal-js
ms-graph
azure-app-services
azure-storage
azure-key-vault
azure-functions
azure-active-directory
azure-active-directory-b2c
microsoft-identity-platform
Tutorial: Enable your JavaScript single-page application (SPA) to sign-in users and call APIs with the Microsoft identity platform
ms-identity-javascript-tutorial

Tutorial: Enable your JavaScript single-page application (SPA) to sign-in users and call APIs with the Microsoft identity platform

Build Code Scan GitHub issues npm GitHub

The Microsoft identity platform, along with Azure Active Directory (Azure AD) and Azure Azure Active Directory B2C (Azure AD B2C) are central to the Azure cloud ecosystem. This tutorial aims to take you through the fundamentals of modern authentication with JavaScript, using the Microsoft Authentication Library for JavaScript (MSAL.js).

We recommend following the chapters in successive order. However, the code samples are self-contained, so feel free to pick samples by topics that you may need at the moment.

โš ๏ธ This is a work in progress. Come back frequently to discover more samples.

Prerequisites

Please refer to each sample's README for sample-specific prerequisites.

Recommendations

  • jwt.ms for inspecting your tokens
  • Fiddler for monitoring your network activity and troubleshooting
  • Follow the Azure AD Blog to stay up-to-date with the latest developments

Please refer to each sample's README for sample-specific recommendations.

Contents

  • For Azure AD, start the tutorial from here
  • For Azure AD B2C, start the tutorial from here

Alternatively, choose below the sample you want to review.

Chapter 1: Sign-in a user to your application

Sign-in with Azure AD
Sign-in your users with the Azure AD and learn to work with ID Tokens. Learn how single sign-on (SSO) works. Learn to secure your apps to operate in national clouds.
Sign-in with Azure AD B2C
Sign-in your customers with Azure AD B2C. Learn to integrate with external social identity providers. Learn how to use user-flows and custom policies.

Chapter 2: Sign-in a user and get an Access Token for Microsoft Graph

Get an Access Token from Azure AD and call Microsoft Graph
Authenticate your users and acquire an Access Token for Microsoft Graph and then call the Microsoft Graph API.

Chapter 3: Protect an API and call the API from your client app

Protect and call a web API on Azure AD
Protect your web API with the Azure AD. Use a client application to sign-in a user, acquire an Access Token for your web API and call your protected Web API.
Protect and call a web API on Azure AD B2C
Protect your web API with Azure AD B2C. Use a client application to sign-in a user, acquire an Access Token for your web API and call your protected web API.

Chapter 4: Call Microsoft Graph from your protected API on behalf-of a signed-in user

Call a web API that calls Microsoft Graph on behalf of a user
Enhance your protected web API to acquire an Access Token for Microsoft Graph on-behalf-of a user signed-in to the client app.
Call a web API that calls another web API with conditional access on behalf of a user
Enhance your protected web API to acquire an Access Token for another web API with MFA requirement on-behalf-of a user signed-in to the client app.

Chapter 5: Deploy your applications to Azure

Deploy to Azure Storage and App Service
Prepare your app for deployment to various Azure services. Learn how to package and upload files, configure authentication parameters and use Azure services for managing your operations.

We'd love your feedback!

Were we successful in addressing your learning objective? Consider taking a moment to share your experience with us.

More information

Learn more about the Microsoft identity platform:

See more code samples:

Community Help and Support

Use Stack Overflow to get support from the community. Ask your questions on Stack Overflow first and browse existing issues to see if someone has asked your question before. Make sure that your questions or comments are tagged with [ms-identity azure-ad azure-ad-b2c msal javascript].

If you find a bug in the sample, please raise the issue on GitHub Issues.

To provide a recommendation, visit the following User Voice page.

Contributing

This project welcomes contributions and suggestions. Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit https://cla.opensource.microsoft.com.

Code of Conduct

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact [email protected] with any additional questions or comments.

ms-identity-javascript-tutorial's People

Contributors

danilosoarescardoso avatar dependabot[bot] avatar derisen avatar haddley avatar idg-sam avatar kalyankrishna1 avatar microsoft-github-operations[bot] avatar microsoftopensource avatar salman90 avatar v-michaelmi avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.