使用 javascript 客户端，如何显示 "virtual folder"（= html、img、js 的连贯集合以及相对路径）？

Question

我想在 html 页面上显示自主“站点”（比如“root”）。这些“站点”包含一个着陆页：index.html 和一组 *.css、.js、.png)
所谓自治，是指这些站点没有外部依赖性，并且所有路径都是相对的 = 您可以将它们复制到任何目录或将它们托管在任何地方，它们将正常工作。
这些网站被压缩在一个包含所有必要文件的档案中。说我下载没问题，所有文件都在内存中（作为 path/uint8 数组）

如何以安全的方式显示网站？我可以解析 index.html，更改原始文件的 data-url 的所有 src 和 href，并将其加载到 iframe 中。它工作得很好，但它会在有这样的脚本的地方中断

if (extension == "pdf")
 img.src = "images/thumb-pdf.png"

有什么方法可以控制 iframe 提供的 url 吗？某种代理？我可以拦截“images/thumb-pdf.png”来代替 MemoryCacheOfAllFiles[images/thumb-pdf.png"].toDataURL() 服务吗？

PS：当然我无法控制那些网站，我不能将它们存储在服务器上（这很容易）

Answer 1

在 javascript 中可以使用代理，必须使用 worker 并监听“获取”事件以推送虚拟内容。

html 推入 iframe:

...
navigator.serviceWorker.register('worker.js').then(function() {
    logInstall('Installing...');
  })
...

worker.js:

...
self.onfetch = function(event) {
  var cached = (mycache[event.request.url]); // do we have content
  if (cached)
    event.respondWith(new Response(cached.content,{
      headers:{"Content-Type",cached.mimetype}
    }
  else
    event.respondWith(fetch(event.request));
}
...

mozilla 的完整代码，用于解压缩和提供内容
https://serviceworke.rs/cache-from-zip.html

使用 javascript 客户端，如何显示 "virtual folder"（= html、img、js 的连贯集合以及相对路径）？

Using javascript client-side, how can I display a "virtual folder" (= a coherent collection of html,img,js with relative paths)?

javascript

virtual-file