Microsoft Graph を使用してユーザーの予定表イベントにアクセスする
このユニットでは、ユーザーの翌週の予定表イベントを表示する方法について説明します。 指定された期間の間データ イベントのクエリを実行する方法と、select や order などの概念を使用して希望する情報を表示する方法についても説明します。.
アプリに必要なアクセス許可を決定する
Microsoft Graph によって公開されるデータはすべてセキュリティで保護されます。 アプリにアクセスするには、適切なアクセス許可が付与されている必要があります。 必要なアクセス許可は、アプリがアクセスする必要のある情報の種類によって異なります。 たとえば、ユーザーの予定表にアクセスするには、アプリに Calendars.Read アクセス許可が必要です。 各操作に必要なアクセス許可の正確なリストは、Microsoft Graph API リファレンスで確認できます。
アプリがさまざまな種類のデータを読み込む場合、ユーザーは、この情報へのアクセスに必要な複数のアクセス許可を付与する必要があります。 アプリで必要なアクセス許可のみを要求します。 このモジュールでは、アプリはユーザーの名前を最初に読み取るアクセス許可を要求し、イベントを表示するボタンを選択した場合にのみ予定表の読み取りを求めます。 このパターンは、動的同意と呼ばれるもので、アクセス許可を要求する方法として推奨されます。 動的な同意により、ユーザーは使用するアプリに共有するデータを制御することができ、セキュリティ リスクを最小限に抑えることができます。
必要なアクセス許可を指定する
アプリに付与されているアクセス許可のリストはアクセス トークンに直接組み込まれます。 OAuth 標準でこれは スコープ と呼ばれています。 アプリケーションで Microsoft 認証ライブラリを使用してアクセス トークンを取得する場合は、Microsoft Entra ID への要求にスコープの一覧を含める必要があります。 Microsoft Graph の各操作には、独自のスコープの一覧があります。 アクセス トークンにそのうちの 1 つがない場合、要求は拒否されます。
サンプル アプリケーションは、現在の Microsoft 認証ライブラリ要求を msalRequest
と呼ばれるグローバル変数に保存します。 最初は、スコープの空の配列が含まれています。
const msalRequest = { scopes: [] };
以下は、サンプル アプリケーションが要求にスコープをさらに追加するために使用するヘルパー関数です。
function ensureScope (scope) {
if (!msalRequest.scopes.some((s) => s.toLowerCase() === scope.toLowerCase())) {
msalRequest.scopes.push(scope);
}
}
Microsoft Graph を呼び出してデータを取得する場合、ヘルパー関数を呼び出し、必要なアクセス許可が含まれていることを確認します。
async function getEvents() {
ensureScope('Calendars.read');
// ...
}
一定の期間内におけるユーザーの予定表イベントを取得する
ユーザーの予定表イベントを Microsoft Graph から取得する場合、前述したように、/me/calendarview
エンドポイントを呼び出す必要があります。 サインインしているユーザーの既定の予定表から、定期的なイベントおよび単一のインスタンスのリストを返します。 エンドポイントと実行するリクエストの種類を指定して、Microsoft Graph SDK を使用して Microsoft Graph エンドポイントを呼び出すことができます。
翌週の予定表イベントのみを表示するには、以下のクエリを使用して結果の時間の範囲をパスします。
graphClient
.api('/me/calendarview')
.query(`startDateTime=${dateNow.toISOString()}&endDateTime=${dateNextWeek.toISOString()}`);
ここで、dateNow
は現在の日付、dateNextWeek
は現在の日付から 7 日間足した日付であり、1 週間という期間を取得します。
Microsoft Graph が取得および転送するデータの量を最小限に抑えると、アプリのパフォーマンスが大幅に向上します。
select
メソッドは、アプリが使用する結果の特定のプロパティを選択するために使用できます。 返されるプロパティは、コンマ区切りのリストとして select
にパスされます。
graphClient
.api('/me/calendarview')
.query(` startDateTime=${dateNow.toISOString()}&endDateTime=${dateNextWeek.toISOString()} `)
.select('subject,start,end');
orderby
メソッドを使用して、結果でアイテムを並べ替える方法を指定します。 複数のフィールドによって並べ替える場合は、フィールドのコンマ区切りのリストを指定します。
asc
またはdesc
のキーワードをクエリに追加することによって、アイテムを昇順または降順に並べ替えることもできます。
このアプリでは、[開始日] フィールドでデータ を昇順に並べ替えます。 または desc
などのasc
キーワードが指定されていない場合、この順序は既定です。
graphClient
.api('/me/calendarview')
.query(` startDateTime=${dateNow.toISOString()}&endDateTime=${dateNextWeek.toISOString()} `)
.select('subject,start,end')
.orderby('Start/DateTime');
次に Microsoft Graph がどのように見えるようになるかです。
graphClient
.api('/me/calendarview')
.query(` startDateTime=${dateNow.toISOString()}&endDateTime=${dateNextWeek.toISOString()} `)
.select('subject,start,end')
.orderby('Start/DateTime')
.get();