クイックスタート: Electron デスクトップ アプリケーションからアクセス トークンを取得して Microsoft Graph API を呼び出す
ようこそ。 ご要望のページを表示できません。 問題の修正に取り組んでいますが、次のリンクから目的の記事にアクセスできるかお試しください。
クイック スタート: Node.js デスクトップ アプリでユーザーのサインインと Microsoft Graph の呼び出しを行う
ご不便をおかけして申し訳ありませんが、問題が解決するまで今しばらくお待ちください。
このクイックスタートでは、Electron デスクトップ アプリケーションでユーザーのサインイン処理を行い、アクセス トークンを取得して Microsoft Graph API を呼び出す方法を示すコード サンプルをダウンロードして実行します。
このクイックスタートでは、PKCE を使用した認可コード フローで Node.js 用 Microsoft Authentication Library (MSAL Node) を使用します。
前提条件
- Node.js
- Visual Studio Code または別のコード エディター
手順 1: Azure portal でのアプリケーションの構成
このクイックスタートのサンプル コードを動作させるには、応答 URL として msal://redirect を追加する必要があります。
アプリケーションはこれらの属性で構成されています。
手順 2: Electron サンプル プロジェクトのダウンロード
注意
Enter_the_Supported_Account_Info_Here
手順 4:アプリケーションの実行
このサンプルの依存関係を 1 回インストールする必要があります。
npm install
次に、コマンド プロンプトまたはコンソールを使用して、アプリケーションを実行します。
npm start
[ サインイン ] ボタンを備えたアプリケーションの UI が表示されます。
コードについて
以降、サンプル アプリケーションのいくつかの重要な要素について説明します。
MSAL Node
MSAL Node はユーザーのサインインを処理し、Microsoft ID プラットフォームによって保護されている API にアクセスするトークンを要求するために使用するライブラリです。 デスクトップ アプリケーションでの MSAL Node の使用方法の詳細については、この記事を参照してください。
MSAL Node は、次の npm コマンドを実行してインストールできます。
npm install @azure/msal-node --save
MSAL の初期化
MSAL Node への参照を追加するには、次のコードを追加します。
const { PublicClientApplication } = require('@azure/msal-node');
続いて、次のコードを使用して MSAL を初期化します。
const MSAL_CONFIG = {
auth: {
clientId: "Enter_the_Application_Id_Here",
authority: "https://login.microsoftonline.com/Enter_the_Tenant_Id_Here",
},
};
const pca = new PublicClientApplication(MSAL_CONFIG);
各値の説明: 説明 clientIdAzure portal に登録されているアプリケーションの "アプリケーション (クライアント) ID"。 この値は、Azure portal のアプリの [概要] ページで確認できます。 authorityユーザーが認証するための STS エンドポイント。 通常、パブリック クラウド上では https://login.microsoftonline.com/{tenant}です。{tenant} はご自分のテナントの名前またはテナント ID です。
トークンの要求
MSAL ノードの acquireTokenInteractive パブリック API を使用して、既定のシステム ブラウザーなどの外部ユーザー エージェントを介してトークンを取得できます。
const { shell } = require('electron');
try {
const openBrowser = async (url) => {
await shell.openExternal(url);
};
const authResponse = await pca.acquireTokenInteractive({
scopes: ["User.Read"],
openBrowser,
successTemplate: '<h1>Successfully signed in!</h1> <p>You can close this window now.</p>',
failureTemplate: '<h1>Oops! Something went wrong</h1> <p>Check the console for more information.</p>',
});
return authResponse;
} catch (error) {
throw error;
}
次の手順
MSAL Node を使用した Electron デスクトップ アプリケーション開発については、次のチュートリアルを参照してください。