使用瀏覽器javascript，如何獲取用戶指定本地目錄的文件和子文件夾的內容

Question

請參閱javascript 中的如何從本地 PC 獲取目錄的內容。 有一個指向 jsfiddle 的鏈接，它只打印出文件的名稱。 是否也可以訪問他們的內容？ 如果是，那么究竟如何？

Answer 1

可能是特定於 Google-Chrome 的答案...我找到了 https://github.com/GoogleChromeLabs/browser-nativefs 。 這有一個鏈接https://browser-nativefs.glitch.me/ 。 查看源代碼並下載 html、css 和 mjs 文件。

我修改了 script.mjs 如下（僅共享代碼的修改部分，並帶有注釋以指示確切的修改）：

  Array.prototype.asyncForEach = async function (fn) {
    for (let i = 0; i < this.length; i++) {
      await fn(this[i], i);
    }
  };

openDirectoryButton.addEventListener('click', async () => {
    try {
      const blobs = await directoryOpen({ recursive: true });
      alert('upload of folder is done')
      //const blobs = await directoryOpen();
      let fileStructure = '';
      await/*added this 'await'*/ blobs.sort((a, b) => {
        a = a.webkitRelativePath + a.name;
        b = b.webkitRelativePath + b.name;
        if (a < b) {
          return -1;
        } else if (a > b) {
          return 1;
        }
        return 0;
      }).asyncForEach/*changed this forEach to asyncForEach*/(async (blob) => {
        // The Native File System API currently reports the `webkitRelativePath`
        // as empty string `''`.
        //added print out of file blob content
        fileStructure += `${blob.webkitRelativePath}${
          blob.webkitRelativePath.endsWith(blob.name) ?
            '' : blob.name}, content: ${await blob.text()}\n`;
      });