ユーザー ファイルを表示する

完了

ユーザーがファイルをダウンロードできるようにするには、利用可能なファイルのリストを表示する必要があります。 この Learn モジュールでは、ファイルはユーザーの OneDrive for Business のルート ディレクトリに保存されます。 開始するには、1、2 つのファイルをドロップする必要がある場合があります。 https://www.office.com/ を参照してサインインし、OneDrive アイコンを選択して、OneDrive for Business のインスタンスにアクセスできます。

アプリが要求するアクセス許可を決定する

Microsoft Graph によって公開されるデータはすべてセキュリティで保護されます。 アプリがアクセスするために適切なアクセス許可が必要です。 必要なアクセス許可は、アプリがアクセスする必要のある情報の種類によって異なります。 たとえば、アプリがユーザーの予定表にアクセスするには、Calendars.Read アクセス許可が必要です。 アプリがユーザーのファイルを読み込むには、Files.Read アクセス許可が必要です。 後でファイルをアップロードするときには、アプリはFiles.ReadWriteアクセス許可が必要です。 各操作に必要なアクセス許可の正確なリストは、Microsoft Graph API リファレンスで確認できます。

アプリがさまざまな種類のデータを読み込む場合、ユーザーは、この情報へのアクセスに必要な複数のアクセス許可を付与する必要があります。 アプリで必要なアクセス許可のみを要求します。 このモジュールで、アプリは最初にファイルを読み込むためのアクセス許可を要求し、ファイルをアップロードしようとするときにのみ、読み取り/書き込みのアクセス許可を要求します。 このパターンは、動的同意と呼ばれるもので、アクセス許可を要求する方法として推奨されます。 動的な同意により、ユーザーは使用するアプリに共有するデータを制御することができ、セキュリティ リスクを最小限に抑えることができます。

必要なアクセス許可を指定する

アプリに付与されているアクセス許可のリストはアクセス トークンに直接組み込まれます。 OAuth 標準でこれは スコープ と呼ばれています。 アプリケーションで Microsoft 認証ライブラリを使用してアクセス トークンを取得する場合は、Microsoft Entra ID への要求にスコープの一覧を含める必要があります。 Microsoft Graph の各操作には独自のスコープのリストがあり、特権の小さいものから大きいものまで整理された独自のリストｇああります。 どの特権も機能するため、アプリケーションで使用するすべての操作で機能する最も小さな特権スコープを選びます。

サンプル アプリケーションは、現在の Microsoft 認証ライブラリ要求を msalRequest と呼ばれるグローバル変数に保存します。 最初は、スコープの空の配列が含まれています。

const msalRequest = { scopes: [] };

以下は、サンプル アプリケーションが要求にスコープをさらに追加するために使用するヘルパー関数です。

function ensureScope (scope) {
  if (!msalRequest.scopes.some((s) => s.toLowerCase() === scope.toLowerCase())) {
    msalRequest.scopes.push(scope);
  }
}

アプリケーションは必要なときにアクセス許可を要求する、という考え方です。 たとえば、ユーザーの OneDrive for Business のルート フォルダーからファイルの一覧をダウンロードするコードを次に示します。

async function getFiles() {
  ensureScope('files.read');
  try {
    const response = await graphClient
      .api('/me/drive/root/children')
      .select('id,name,folder,package')
      .get();
    return response.value;
  } catch (error) {
    console.error(error);
  }
}

ensureScope() への呼び出しにより、files.read アクセス許可が Microsoft Graph の呼び出しに使うアクセス トークンに含まれるようにします。

Microsoft Graph SDK は、msalRequest オブジェクトを使用して MSAL を呼び出し、Microsoft Graph のすべての呼び出しに対してこれを実行します。 このアクティビティは無駄に思われるでしょうが、そうではありません。 古いアクセス トークンの有効期限が切れるか、アクセス許可のスコープが変更されるまで、MSAL が同じアクセス トークンを自動的に再利用します。 graph.js の上部にはコードが表示され、コードには以下の指示が設定されています。

const authProvider = {
  getAccessToken: async () => {
    return await getToken();
  }
};
const graphClient = MicrosoftGraph.Client.initWithMiddleware({ authProvider });

まず、このコードは authProvider を宣言します。これは、 getAccessToken() 関数を含む JSON オブジェクトです。 この関数は、MSAL を呼び出す auth.js ファイルの getToken() 関数を呼び出します。 必要に応じてこれを確認できます。 authProvider オブジェクトは、 getAccessToken() を必要に応じて呼び出す Microsoft SDK にパスされるため、コードはこれを行う必要がありません。

Microsoft Graph を使用してユーザーの OneDrive ルート ディレクトリ内のファイルを取得する

このファイルのリストを取得するには、/me/drive/root/children リソースを使用します。 Microsoft Graph には、/me や /rootのようなショートカットがあるので、現在のユーザーの OneDrive ルート ディレクトリのルート フォルダーにあるファイルを取得する方が簡単です。 たとえば、別のユーザーの Documents フォルダー内のファイルを列挙するには、ユーザーのユーザー ID とユーザーの /Documents フォルダーのアイテム ID を検索し、/users/{user-id}/drive/items/{item-id}/children にアクセスする必要があります。

ヒント

Microsoft Graph は、OneDrive、OneDrive for Business、および SharePoint Online のファイルへのアクセスを提供しています。 Microsoft Teams や他の Microsoft 365 サービスでは、OneDrive for Business および SharePoint にファイルが保存されます。 ファイル操作は同じですが、サービスごとにリソース (URL) が少し異なります。

この GET 要求は、Microsoft Graph SDK で次のように表されます。

const response = await graphClient
  .api('/me/drive/root/children')
  .get();

必要な特定のデータ列を指定することで、呼び出しをより効率的にできます。 これは、(OData 標準にもとづいて) REST の $select= query 文字列パラメーターを使って処理されます。 SDK では、select() 関数を提供することで、より簡単に処理できます。 要求を読み取りやすくするために、関数をチェーンできることに注目してください。

const response = await graphClient
    .api('/me/drive/root/children')
    .select('id,name,folder,package')
    .get();

次のステップ

これまでの内容を実践して、ユーザーの OneDrive for Business のルート フォルダー内のファイル一覧を表示するようアプリを拡張しましょう。