Electron：防止 DOM 中的 <style> 标签加载答案

【问题标题】：Electron: Prevent <style> tags in DOM from loadingElectron：防止 DOM 中的 <style> 标签加载
【发布时间】：2018-10-01 20:26:10
【问题描述】：

有没有办法在显示页面之前从 Electron webview 中删除所有样式？

到目前为止，我可以在文档加载后注入 JS 来移除所有样式：

document.addEventListener("DOMContentLoaded", function(){
  document.querySelectorAll('link[rel="stylesheet"], style').forEach(elem => elem.disabled = true);
});

这里的问题是样式会在样式被删除之前显示一小段时间（约 1 秒）。

我还可以在我的 Main 类中使用以下内容在页面加载之前删除所有 .css 文件：

session.webRequest.onBeforeRequest({urls: ['https://*/*.css', 'http://*/*.css']}, function(details, callback) {
  callback({cancel: true});
});

但是，这不会删除嵌入在 DOM 中的标签。为了更好地了解我想要做什么，您可以查看 Firefox 的“无样式”功能（查看 -> 页面样式 -> 无样式）。

提前致谢。

【问题讨论】：

也许尝试注入 CSP？

标签： javascript html css webview electron

【解决方案1】：

我可以想到两种方法来防止这种情况：

为 webview 赋予可见性：隐藏样式，并使其稍后可见。
指向将去除内联和链接 CSS 的转发代理

对我来说，1 号听起来是一个更快、更可靠的解决方案，但我还没有尝试过。

让我知道进展如何。

【讨论】：