Window: showDirectoryPicker() 메서드

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Experimental: 이 기능은 실험적인 기능입니다.
프로덕션 환경에서 사용하기 전에 브라우저 호환성 표를 주의 깊게 확인하세요.

Window 인터페이스의 showDirectoryPicker() 메서드는 사용자가 디렉터리 한 개를 선택할 수 있는 디렉터리 선택창을 엽니다.

showDirectoryPicker()

아래의 옵션을 포함하는 객체입니다.

id Optional: ID를 지정하면 브라우저가 선택창의 ID마다 마지막으로 탐색한 디렉터리를 기억합니다. 다른 선택창에서 같은 ID를 사용한다면, 이전에 해당 ID로 탐색했던 디렉터리에서 선택창이 열립니다.
mode Optional: 디렉터리에 대한 읽기 전용 접근 시 "read", 읽기와 쓰기 모두 가능한 접근 시 "readwrite"이어야 합니다. 기본 값은 "read"입니다.
startIn Optional: 선택창이 열릴 때의 최초 디렉터리를 가리키는 FileSystemHandle, 또는 널리 알려진 디렉터리 식별자("desktop", "documents", "downloads", "music", "pictures", 또는 "videos")입니다.

AbortError DOMException: 사용자가 디렉터리를 선택하지 않고 선택창을 닫았을 때, 사용자 에이전트가 판단했을 때 디렉터리가 너무 민감하거나 위험할 때, 또는 지정한 mode 옵션에 대해 선택한 디렉터리의 PermissionStatus.state가 "granted"가 아닐 때 발생합니다.
SecurityError DOMException: 동일 출처 정책에 의해 호출이 차단됐거나, 버튼 클릭과 같은 사용자 상호작용에 의해 호출된 것이 아니라면 발생합니다.

사용자의 임시 활성화가 필요합니다. 이 기능이 동작하려면 사용자가 페이지 또는 UI 요소와 상호작용해야 합니다.

다음 비동기 함수는 디렉터리 선택창을 열고, 사용자가 디렉터리를 선택한 후에 FileSystemDirectoryHandle를 반환합니다.

async function getDir() {
  const dirHandle = await window.showDirectoryPicker();

  // dirHandle을 사용하는 코드들
}

Specification
File System Access # api-showdirectorypicker

BCD tables only load in the browser