我们的网络扩展希望在HTML文件和内容托管在本地存储而不是托管在线的情况下，允许在VS Code webview中预览HTML文件。目标HTML托管在一个小型 Package 主webview HTML内的iFrame中。
为了实现这个功能，我们希望在我们的webview中提供一个服务工作者来拦截fetch调用，以便我们的扩展可以处理文件请求并从本地存储加载和返回资源。然而，我们无法在VS Code webview中托管的服务工作者上获得成功，无论是在顶级 Package HTML还是尝试在目标托管的HTML中注册它。
在研究服务工作者时，我认为以下几点是正确的：
- 服务工作者不能使用数据URL进行注册：Create service worker from Blob/String URL w3c/ServiceWorker#578(我认为这就是如何在vscode webview中工作的web workers)
- 服务工作者需要匹配来源：Is it possible to serve service workers from CDN/remote origin? w3c/ServiceWorker#940
到目前为止，我尝试过的所有事情基本上都在这里：
我创建了一个指向我们服务工作者文件的asWebviewUri(它被添加到可以在localResourceRoots中访问的位置),但由于来源差异，服务工作者无法加载，无论是在这个webview的顶层还是下面的iFrame中。
鉴于我所看到的，我认为我现在无法实现我想要的功能，但如果它可以被启用，对我们的场景将会非常有帮助。
4条答案
按热度按时间js5cn81o1#
你是否尝试在webview内部使用iframe,指向你控制的域名？这应该允许服务工作者在iframe内激活。这基本上是我们实现webviews的方法。
bprjcwpo2#
你是否尝试在webview中使用一个指向你控制的域名的iframe?这应该允许服务工作者在iframe内激活。这基本上是我们实现webviews的方法。
关于你提到的我控制的域名，我觉得可能遗漏了一些东西。在开始这个项目之前，我对iframe的知识非常有限，所以我可能只是没有理解一些基本的东西。
在我们所面临的情况(可能是离线场景)中，除了vscode-webview://和由webview URIs创建的资源域名之外，没有其他域名可以接收来自其他地方的内容。在我看来，在webview托管的顶级HTML中，我的域名总是会是vscode-webview://。在我托管在下面的iframe中，我可以尝试将src设置为其他内容。但对于我们的场景，我们没有访问外部域名，而是托管了一个本地工作区文件。在这种情况下，我发现这里的src=""实际上并没有解析webview URI。例如：
我在iframe上方放置了一个带有webview uri src的图像，同时还有一个带有webview uri src的webview uri src(这两个文件都存在),虽然图像可以正确解析，但iframe无法解析webview uri src。
因此，我不得不在托管HTML的主webview中加载iframe源，然后将其设置为iframe的srcdoc。现在这是我可能弄错的部分，但是有了srcdoc,我的来源似乎要么是一个特殊的唯一来源，要么如果我在沙箱上指定allow-same-origin,我可以继承相同的vscode-webview://。所以我不知道如何让这个iframe指向不同的域名或者使用哪个域名，因为我们这里只有webview和本地内容可用。
如果以上任何一点我都偏离了方向，请多包涵并感谢你的回复。
wmvff8tz3#
可能类似于以下内容：
<iframe src="https://potentially-unique-subdomain.your-custom-domain.com"></iframe>https://potentially-unique-subdomain.your-custom-domain.com上，你托管了一个由你的扩展控制的HTML文件和JS脚本。https://potentially-unique-subdomain.your-custom-domain.com下运行的脚本。此时，iframe的内容现在由服务工作者控制。iframe也能够使用 post message 与其父webview进行通信。
然后要在iframe内加载自定义html:
document.writeI()与新的html内容一起使用。这确实需要在
potentially-unique-subdomain.your-custom-domain.com上托管内容，但我们也需要为vscode.dev做同样的事情。整个方法实际上与VS Code的webviews非常相似。不幸的是，我认为在这个时候，如果没有外部域，你是无法做到这一点的。yyhrrdl84#
感谢澄清。是的，我猜你可能在建议这个外部域名。目前我们的工具确实是一个在线工具，但我们一直在尝试构建一个可能性，即我们可能会部署在学习环境中(学校/监狱等...),在那里添加更多的域名以连接可能会受到限制。所以很高兴知道，根据你的建议，只要我们愿意自己托管，我们就有一个合理的选择。我们计划在某个时候托管学生内容进行共享，所以我们可能不得不解决这个问题。
还有一个小问题，这种行为是预期的吗？
我在一个带有webview uri src的iframe上方放置了一个图像(两个文件都存在),虽然图像解析正确，但iframe无法解析webview uri src。
对我来说，嵌入在iFrame中的内容无法解析webview URI是有道理的，但我有点惊讶于iFrame元素本身无法解析它，因为我认为该元素与img处于同一级别。