Javascript 停止 window 加载后显示一些内容

Question

我正在编写一个 chrome 扩展程序来停止特定网站的页面加载。我这样做的方法是将我的内容脚本注入页面并调用

window.stop()

这按预期工作，我看到一个空白的白色网页。我现在想在这个空白的白页上显示自定义消息，我该怎么做。

这是我到目前为止尝试过的方法，在调用 window.stop() 之后，我得到了这一行：

document.body.innerHTML += '<div style="position:absolute;width:100%;height:100%; z-index:100;background:#000;"></div>';

但是它抛出一个错误

 Uncaught TypeError: Cannot read property 'innerHTML' of null

我检查了 DOM，里面确实有 body 标签。我不确定哪里出了问题。

Answer 1

您可以随时使用 window.document.write()。

你的代码看起来像...

document.write("<div style='position:absolute;width:100%;height:100%; z-index:100;background:#000;'></div>")

Answer 2

我假设您通过在 document_start 处注入内容脚本并在此处决定是否阻止来阻止站点。

更好的方法是完全取消初始请求，并将其重定向到您自己的错误页面。

webRequest API 可以做到：

 chrome.webRequest.onBeforeRequest.addListener(
    function(details) {
      if(/* condition based on details */) {
        // The file might need to be in web_accessible_resources
        return {redirectUrl: chrome.runtime.getURL("my_error.html")};
      }
    },
    {urls: ["<all_urls>"], types: ["main_frame"]},
    ["blocking"]
 );

注意：这将在每次导航请求时调用您的测试代码；这可能会减慢速度。如果您有特定的网站列表，您可以将它们放在过滤器的 urls 参数中以获得更好的性能。

您将需要涵盖要阻止的站点的主机权限（或者 "<all_urls>" 如果您可能需要所有这些站点），"webRequest" 和 "webRequestBlocking"。

Javascript 停止 window 加载后显示一些内容

Javascript show some content after stopping window load

html

javascript

dom

google-chrome-extension

content-script