File System API

async function getFile() {
  // 파일 선택창을 열고 구조 분해로 첫 번째 핸들을 가져옴
  const [fileHandle] = await window.showOpenFilePicker();
  const file = await fileHandle.getFile();
  return file;
}

const pickerOpts = {
  types: [
    {
      description: "Images",
      accept: {
        "image/*": [".png", ".gif", ".jpeg", ".jpg"],
      },
    },
  ],
  excludeAcceptAllOption: true,
  multiple: false,
};

async function getTheFile() {
  // 파일 선택창을 열고 구조 분해로 첫 번째 핸들을 가져옴
  const [fileHandle] = await window.showOpenFilePicker(pickerOpts);

  // 파일 내용 가져오기
  const fileData = await fileHandle.getFile();
}

const dirName = "directoryToGetName";

// 'currentDirHandle'이라는 이름의 디렉터리 핸들이 이미 존재한다고 가정
const subDir = currentDirHandle.getDirectoryHandle(dirName, { create: true });

async function returnPathDirectories(directoryHandle) {
  // 파일 선택창을 열어 파일 핸들 가져오기
  const [handle] = await self.showOpenFilePicker();
  if (!handle) {
    // 사용자가 취소했거나 다른 이유로 파일 열기 실패
    return;
  }

  // 위의 파일 핸들이 주어진 디렉터리 핸들 내에 위치하는지 확인
  const relativePaths = await directoryHandle.resolve(handle);

  if (relativePaths === null) {
    // 디렉터리 핸들 밖에 있음
  } else {
    // relativePaths는 상대 경로를 구성하는 경로 이름의 배열임

    for (const name of relativePaths) {
      // 각 항목 기록
      console.log(name);
    }
  }
}

async function saveFile() {
  // 새 핸들 생성
  const newHandle = await window.showSaveFilePicker();

  // Blob을 쓸 FileSystemWritableFileStream 생성
  const writableStream = await newHandle.createWritable();

  // 파일에 쓰기
  await writableStream.write(imgBlob);

  // 파일을 닫아서 콘텐츠 쓰기가 디스크에 반영되도록 하기
  await writableStream.close();
}

// 옵션 없이 데이터만
writableStream.write(data);

// 스트림에 쓸 때 사전에 결정한 위치부터 시작
writableStream.write({ type: "write", position, data });

// 현재 파일 커서를 지정된 위치로 변경
writableStream.write({ type: "seek", position });

// 파일이 size 바이트 크기가 되도록 변경
writableStream.write({ type: "truncate", size });

onmessage = async (e) => {
  // 메인 스크립트에서 받은 메시지 회수
  const message = e.data;

  // OPFS 파일 작성을 위한 핸들 가져오기
  const root = await navigator.storage.getDirectory();
  const draftHandle = await root.getFileHandle("draft.txt", { create: true });
  // 동기적 접근 핸들 가져오기
  const accessHandle = await draftHandle.createSyncAccessHandle();

  // 파일 크기 가져오기
  const fileSize = accessHandle.getSize();
  // 파일 내용을 버퍼에 넣기
  const buffer = new DataView(new ArrayBuffer(fileSize));
  const readBuffer = accessHandle.read(buffer, { at: 0 });

  // 메시지를 파일 끝에 붙이기
  const encoder = new TextEncoder();
  const encodedMessage = encoder.encode(message);
  const writeBuffer = accessHandle.write(encodedMessage, { at: readBuffer });

  // 디스크에 반영
  accessHandle.flush();

  // 작업 종료 후엔 항상 FileSystemSyncAccessHandle 닫아주기
  accessHandle.close();
};