Microsoft Identity Platform JavaScript 教程

最新推荐文章于 2024-09-15 08:43:08 发布

沈书苹Peter

最新推荐文章于 2024-09-15 08:43:08 发布

阅读量346

点赞数 4

本文链接：https://blog.csdn.net/gitblog_00443/article/details/142243294

版权

Microsoft Identity Platform JavaScript 教程

ms-identity-javascript-tutorial A chapterwise tutorial that will take you through the fundamentals of modern authentication with Microsoft identity platform in Vanilla JavaScript. 项目地址: https://gitcode.com/gh_mirrors/ms/ms-identity-javascript-tutorial

项目介绍

ms-identity-javascript-tutorial 是一个由 Azure-Samples 提供的开源项目，旨在帮助开发者通过一系列章节化的教程，掌握使用 Microsoft Identity Platform 进行现代身份验证的基础知识。该项目使用 Vanilla JavaScript 和 Microsoft Authentication Library for JavaScript (MSAL.js) 来实现用户登录、获取访问令牌以及调用 API 等功能。

项目快速启动

环境准备

在开始之前，请确保你已经安装了以下工具：

Node.js
Visual Studio Code (VS Code)
Azure Tools Extension (可选，用于 Azure 资源管理)
现代 Web 浏览器

克隆项目

首先，克隆项目到本地：

git clone https://github.com/Azure-Samples/ms-identity-javascript-tutorial.git
cd ms-identity-javascript-tutorial

安装依赖

进入项目目录后，安装所需的依赖：

npm install

运行项目

启动开发服务器：

npm start

打开浏览器，访问 http://localhost:3000，你将看到应用的登录页面。

示例代码

以下是一个简单的示例代码，展示了如何使用 MSAL.js 进行用户登录：

import * as msal from "@azure/msal-browser";

const msalConfig = {
    auth: {
        clientId: "YOUR_CLIENT_ID",
        authority: "https://login.microsoftonline.com/YOUR_TENANT_ID",
        redirectUri: "http://localhost:3000"
    }
};

const msalInstance = new msal.PublicClientApplication(msalConfig);

function login() {
    msalInstance.loginPopup()
        .then(response => {
            console.log("User logged in:", response);
        })
        .catch(error => {
            console.error("Login error:", error);
        });
}

document.getElementById("loginButton").addEventListener("click", login);