javascript - 在 Chrome 扩展中保留 FileSystemDirectoryHandle 对象

Question

我正在开发 Chrome 扩展程序。在弹出窗口中我可以运行window.showDirectoryPicker()，它返回类型的对象FileSystemDirectoryHandle。

我的问题是，在浏览器弹出窗口中更改选项卡后会自动关闭，因此对象被销毁。

我的问题是：有没有办法将此对象传递给任何其他上下文（例如，ServiceWorker 或其他窗口）？

或者，如果不可能，有没有办法在扩展的 ServiceWorker 中调用 window.showDirectoryPicker() ？

Answer 1

• 通过标准服务工作者消息从扩展页面发送句柄：

  (async () => {
    const handle = await window.showDirectoryPicker();
    const swr = await navigator.serviceWorker.ready;
    swr.active.postMessage(handle);
  })();
  

  在 service worker 中，使用self.onmessage = e => { console.log(e) };
  注意它会在后台 devtools 中打印。

• 从一个扩展页面复制到当前通过getViews打开的另一个扩展页面：

  chrome.tabs.create({url: 'another.html'}, async tab => {
    await new Promise(resolve => {
      chrome.tabs.onUpdated.addListener(function onUpdated(tabId) {
        if (tabId === tab.id) {
          chrome.tabs.onUpdated.removeListener(onUpdated);
          resolve();
        }
      });
    });
    const wnd = chrome.extension.getViews({tabId: tab.id})[0];
    wnd._handle = handle;
    // `another` page will see a global variable `window._handle`
  });
  

• 通过扩展页面或 service worker 中的BroadcastChannel发送。

• 将其保存在IndexedDB中并在将来重复使用。