사용자 파일 표시

완료됨

사용자가 파일을 다운로드하려면 사용 가능한 파일 목록을 표시해야 합니다. 이 Learn 모듈에서 파일은 사용자의 비즈니스용 OneDrive 루트 디렉터리에 있습니다. 시작할 파일을 한두 개 삭제할 수 있습니다. https://www.office.com/으로 이동하여 로그인하고 OneDrive 아이콘을 선택하여 비즈니스용 OneDrive 인스턴스에 액세스할 수 있습니다.

파일 목록을 보여 주는 스크린샷.

앱에 필요한 사용 권한 결정

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 루트 폴더에서 파일 목록을 다운로드하는 코드는 다음과 같습니다.

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()을(를) 호출하면 Microsoft Graph를 호출하는 데 사용할 액세스 토큰에 files.read 권한이 포함됩니다.

Microsoft Graph SDK는 msalRequest 개체를 사용하여 Microsoft 인증 라이브러리 호출을 처리하며 모든 Microsoft Graph 호출에 대해 이 작업을 수행합니다. 이 작업은 불필요한 것처럼 보이지만, 그렇지 않습니다. Microsoft 인증 라이브러리는 이전 토큰이 만료되거나 권한 범위가 변경될 때까지 동일한 액세스 토큰을 자동으로 다시 사용합니다. graph.js 맨 위에 이 명령이 설정된 코드를 볼 수 있습니다.

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

우선, 코드는 getAccessToken() 함수를 포함하는 JSON 개체인 authProvider을(를) 선언합니다. 이 함수는 microsoft 인증 라이브러리를 호출하는 auth.js 파일의 함수인 getToken()을 호출합니다. 원하는 경우 확인할 수 있습니다. authProvider 개체는 필요할 때마다 getAccessToken()을(를) 호출하는 Microsoft SDK에 전달되므로, 코드가 필요하지 않습니다.

Microsoft Graph를 사용하여 사용자의 OneDrive 루트 디렉터리에서 파일을 검색합니다.

이 파일 목록을 가져오려면 /me/drive/root/children 리소스를 사용합니다. Microsoft Graph에서 /me/root와 같은 바로 가기를 제공하므로 현재 사용자의 OneDrive 루트 디렉터리의 루트 폴더에 파일을 가져오는 것이 더 쉽습니다. 예를 들어 다른 사용자의 문서 폴더에 있는 파일을 열거하려면 사용자의 사용자 ID와 /Documents 폴더의 항목 ID를 조회한 다음 /users/{user-id}/drive/items/{item-id}/children에 액세스해야 합니다.

Microsoft Graph는 OneDrive, 비즈니스용 OneDrive 및 SharePoint Online의 파일에 대한 액세스를 제공합니다. Microsoft Teams 및 기타 Microsoft 365 서비스는 비즈니스용 OneDrive 및 SharePoint Online에 파일을 저장합니다. 파일 작업은 동일하지만 리소스(URL)는 이러한 각 서비스마다 약간 다릅니다.

이 GET 요청은 다음과 같이 Microsoft Graph SDK로 표현됩니다.

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

필요한 데이터 열을 지정하여 호출을 보다 효율적으로 만들 수 있습니다. 이 작업은 REST에서 $select= query 문자열 매개 변수를 사용하여 처리됩니다(OData 표준 기준). SDK를 사용하면 select() 함수를 제공하여 더 쉽게 작업할 수 있습니다. 함수를 연결하여 요청을 쉽게 읽을 수 있습니다.

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

다음 단계

학습한 모든 내용을 연습하고 앱을 확장하여 사용자의 비즈니스용 OneDrive 루트 폴더에 파일 목록을 표시해 보겠습니다.