Microsoft Graph ツールキットの使用を開始

  • [アーティクル]

Microsoft Graph Toolkit コンポーネントは、Web アプリケーション、SharePoint Web パーツ、または Microsoft Teams タブに簡単に追加できます。 コンポーネントは Web 標準に基づいており、プレーンな JavaScript プロジェクトでも、Reach、Angular、Vue.jsなどの一般的な Web フレームワークでも使用できます。

ツールキットの使用を開始するには、この短いビデオをご覧ください。

詳細なチュートリアルについては、「 Microsoft Graph Toolkit の概要 」モジュールを参照してください。

教育機関向け Microsoft 365 テナントをセットアップする

Microsoft Graph Toolkit を使用してアプリを開発するには、Microsoft 365 テナントにアクセスする必要があります。 お持ちでない場合は、Microsoft 365 開発者プログラムに参加することで、 無料の Microsoft 365 開発者サブスクリプションを入手できます。 サブスクリプションを構成する方法の詳細については、「 Microsoft 365 開発者サブスクリプションを設定する」を参照してください。

開発環境をセットアップする

ツールキットを使用して開発するには、次のものが必要です。

  • テキスト エディターまたは IDE。 任意のエディターまたは IDE を使用することも、 Visual Studio Code を無料でインストールして使用することもできます。
  • Microsoft Edge、Google Chrome、Firefox などの最新の Web ブラウザー。
  • Node.jsの LTS バージョン。 nodejs.org からインストールできます。

Microsoft Graph Toolkit を使用する

アプリケーションで Microsoft Graph Toolkit を使用するには、ローダーを直接 (経由 unpkgで) 参照するか、パッケージを npm インストールします。

を使用して mgt-loaderツールキットを使用するには、スクリプト内の参照をコードに追加します。

<script src="https://unpkg.com/@microsoft/mgt@2/dist/bundle/mgt-loader.js"></script>

<mgt-msal2-provider client-id="<YOUR_CLIENT_ID>"></mgt-msal2-provider>
<mgt-login></mgt-login>

NPM パッケージ

Microsoft Graph Toolkit は複数の NPM パッケージで構成されており、アプリケーションに必要なコードのみを含めることができます。

@microsoft/mgt-element

@microsoft/mgt-elementは、コンポーネントとプロバイダーの構築に使用される基底クラスのみを含むコア パッケージです。 このパッケージでは、独自のコンポーネントを構築するために必要なすべてのクラスとインターフェイスを公開し、カスタム プロバイダーを構築するために IProvider インターフェイスと SimpleProvider クラス をエクスポートします。

@microsoft/mgt-components

パッケージ@microsoft/mgt-componentsには、、、などPersonPeoplePicker、Microsoft Graph に接続されているすべての Web コンポーネントが含まれています。

プロバイダー

プロバイダーは 1 つのパッケージで利用でき、必要に応じてインストールできます。 次のプロバイダー パッケージを使用できます。

  • @microsoft/mgt-msal-provider

    @microsoft/mgt-msal-providerには、 コンポーネントと mgt-msal-provider コンポーネントがMsalProvider含まれています。 MSAL プロバイダーは、Web アプリとプログレッシブ Web Apps (PWA) での認証にmsal.jsを使用します。

  • @microsoft/mgt-msal2-provider

    @microsoft/mgt-msal2-providerには、 コンポーネントと mgt-msal2-provider コンポーネントがMsal2Provider含まれています。 MSAL2 プロバイダーは、Web アプリと PWA での認証に msal-browser を使用します。

  • @microsoft/mgt-teams-provider

    @microsoft/mgt-teams-providerには、 コンポーネントと mgt-teams-provider コンポーネントがTeamsProvider含まれています。 Microsoft Teams プロバイダーは、Microsoft Teams タブ アプリケーションで認証を有効にします。

  • @microsoft/mgt-teams-msal2-provider

    @microsoft/mgt-teams-msal2-providerには、 コンポーネントと mgt-teams-msal2-provider コンポーネントがTeamsMsal2Provider含まれています。 Microsoft Teams MSAL2 プロバイダーは、Microsoft Teams タブ アプリケーションで認証を有効にします。

  • @microsoft/mgt-sharepoint-provider

    @microsoft/mgt-sharepoint-provider には、 SharePointProvider SharePoint 環境で認証するための が含まれています。

  • @microsoft/mgt-proxy-provider

    @microsoft/mgt-proxy-provider には、 ProxyProvider Graph がバックエンド サービスを介して呼び出すアプリケーションの が含まれます。

@microsoft/mgt

パッケージは@microsoft/mgt、上記のすべてのパッケージを含むメイン パッケージであり、それらを再エクスポートして、インストールできる 1 つのパッケージで使用できるようにします。

@microsoft/mgt-react

パッケージには@microsoft/mgt-react、自動生成されたすべてのReact コンポーネントが含まれており、パッケージに依存します@microsoft/mgt。

@microsoft/mgt-spfx

パッケージ@microsoft/mgt-spfxには、SharePoint Framework ソリューションで Microsoft Graph Toolkit を使用するために必要なSharePoint Framework ライブラリが含まれています。

次の手順

これで、Microsoft Graph Toolkit で開発を開始する準備ができました。 開始に役立つ次のガイドを使用できます。