파일 캐시 추가

src/hooks.client.ts

@@ -1,5 +1,7 @@
 import type { ClientInit } from "@sveltejs/kit";
 import { getClientKey, getMasterKeys, getHmacSecrets } from "$lib/indexedDB";
+import { prepareFileCache } from "$lib/modules/cache";
+import { prepareOpfs } from "$lib/modules/opfs";
 import { clientKeyStore, masterKeyStore, hmacSecretStore } from "$lib/stores";
 
 const prepareClientKeyStore = async () => {
@@ -29,5 +31,11 @@ const prepareHmacSecretStore = async () => {
 };
 
 export const init: ClientInit = async () => {
-  await Promise.all([prepareClientKeyStore(), prepareMasterKeyStore(), prepareHmacSecretStore()]);
+  await Promise.all([
+    prepareFileCache(),
+    prepareClientKeyStore(),
+    prepareMasterKeyStore(),
+    prepareHmacSecretStore(),
+    prepareOpfs(),
+  ]);
 };

src/lib/indexedDB/cacheIndex.ts

@@ -0,0 +1,24 @@
+import { Dexie, type EntityTable } from "dexie";
+
+export interface FileCacheIndex {
+  fileId: number;
+  cachedAt: Date;
+  lastRetrievedAt: Date;
+  size: number;
+}
+
+const cacheIndex = new Dexie("cacheIndex") as Dexie & {
+  fileCache: EntityTable<FileCacheIndex, "fileId">;
+};
+
+cacheIndex.version(1).stores({
+  fileCache: "fileId",
+});
+
+export const getFileCacheIndex = async () => {
+  return await cacheIndex.fileCache.toArray();
+};
+
+export const storeFileCacheIndex = async (fileCacheIndex: FileCacheIndex) => {
+  await cacheIndex.fileCache.put(fileCacheIndex);
+};

src/lib/indexedDB/index.ts

@@ -0,0 +1,2 @@
+export * from "./cacheIndex";
+export * from "./keyStore";

src/lib/modules/cache.ts

@@ -0,0 +1,33 @@
+import { getFileCacheIndex, storeFileCacheIndex, type FileCacheIndex } from "$lib/indexedDB";
+import { readFileFromOpfs, writeFileToOpfs } from "$lib/modules/opfs";
+
+const fileCacheIndex = new Map<number, FileCacheIndex>();
+
+export const prepareFileCache = async () => {
+  for (const cache of await getFileCacheIndex()) {
+    fileCacheIndex.set(cache.fileId, cache);
+  }
+};
+
+export const getFileCache = async (fileId: number) => {
+  const cacheIndex = fileCacheIndex.get(fileId);
+  if (!cacheIndex) return null;
+
+  cacheIndex.lastRetrievedAt = new Date();
+  storeFileCacheIndex(cacheIndex); // Intended
+  return await readFileFromOpfs(`/cache/${fileId}`);
+};
+
+export const storeFileCache = async (fileId: number, fileBuffer: ArrayBuffer) => {
+  const now = new Date();
+  await writeFileToOpfs(`/cache/${fileId}`, fileBuffer);
+
+  const cacheIndex: FileCacheIndex = {
+    fileId,
+    cachedAt: now,
+    lastRetrievedAt: now,
+    size: fileBuffer.byteLength,
+  };
+  fileCacheIndex.set(fileId, cacheIndex);
+  await storeFileCacheIndex(cacheIndex);
+};

src/lib/modules/opfs.ts

@@ -0,0 +1,53 @@
+let rootHandle: FileSystemDirectoryHandle | null = null;
+
+export const prepareOpfs = async () => {
+  rootHandle = await navigator.storage.getDirectory();
+};
+
+const getFileHandle = async (path: string, create = true) => {
+  if (!rootHandle) {
+    throw new Error("OPFS not prepared");
+  } else if (path[0] !== "/") {
+    throw new Error("Path must be absolute");
+  }
+
+  const parts = path.split("/");
+  if (parts.length <= 1) {
+    throw new Error("Invalid path");
+  }
+
+  try {
+    let directoryHandle: FileSystemDirectoryHandle = rootHandle;
+
+    for (const part of parts.slice(0, -1)) {
+      if (!part) continue;
+      directoryHandle = await directoryHandle.getDirectoryHandle(part, { create });
+    }
+
+    return directoryHandle.getFileHandle(parts[parts.length - 1]!, { create });
+  } catch (e) {
+    if (e instanceof DOMException && e.name === "NotFoundError") {
+      return null;
+    }
+    throw e;
+  }
+};
+
+export const readFileFromOpfs = async (path: string) => {
+  const fileHandle = await getFileHandle(path, false);
+  if (!fileHandle) return null;
+
+  const file = await fileHandle.getFile();
+  return await file.arrayBuffer();
+};
+
+export const writeFileToOpfs = async (path: string, data: ArrayBuffer) => {
+  const fileHandle = await getFileHandle(path);
+  const writable = await fileHandle!.createWritable();
+
+  try {
+    await writable.write(data);
+  } finally {
+    await writable.close();
+  }
+};

src/routes/(fullscreen)/file/[id]/service.ts

@@ -1,10 +1,14 @@
+import { getFileCache, storeFileCache } from "$lib/modules/cache";
 import { decryptData } from "$lib/modules/crypto";
 
-export const requestFileDownload = (
+export const requestFileDownload = async (
   fileId: number,
   fileEncryptedIv: string,
   dataKey: CryptoKey,
 ) => {
+  const cache = await getFileCache(fileId);
+  if (cache) return cache;
+
   return new Promise<ArrayBuffer>((resolve, reject) => {
     const xhr = new XMLHttpRequest();
     xhr.responseType = "arraybuffer";
@@ -21,6 +25,7 @@ export const requestFileDownload = (
         dataKey,
       );
       resolve(fileDecrypted);
+      await storeFileCache(fileId, fileDecrypted);
     });
 
     // TODO: Progress, ...