如何检查标签加载失败答案

【问题标题】：how to check tab load failed如何检查标签加载失败
【发布时间】：2012-04-30 13:42:19
【问题描述】：

我需要在更新的标签上做一些事情，比如检查页面加载是否正确，并替换页面内的内容。这是我的代码

// background.js

chrome.tabs.onUpdate.addListener(function(tabId, changeInfo, tab){
    try{
       chrome.tabs.executeScript(tabId, filename);
    } catch(e) {
       // 1. when I open a new tab
       // 1. Error during tabs.executeScript: Unknown error.
       // 2. when I request a url not arrive-able.
       // 2. Error during tabs.executeScript: Cannot access contents of url 
       //    "data:text/html,chromewebdata". Extension manifest must request 
       //    permission to access this host.

       // but I can't catch these errors, they just appers in background console.  
    }
});

我在上传的时候尝试执行脚本，但是如果当前标签是chrome://newtab或者chrome错误页面，我不能这样做，但是我无法捕捉到错误。

【问题讨论】：

标签： javascript google-chrome google-chrome-extension browser-tab

【解决方案1】：

没有直接的方法可以捕获这些错误。但是，我刚刚创建了一个实现目标的方法：

使用chrome.tabs.onUpdated（使用d！）。
此事件被触发两次，分别在页面初始化时 ("loading") 和 DOM 已加载时 ("complete")。
使用chrome.tabs.executeScript(tabId, {file: fileName}, fn_callback);
第二个参数必须是一个对象，包含"file" 或"code"。第三个参数，一个函数，总是在脚本注入完成后执行。

现在，真正的实现：
1. 执行内容脚本（使用chrome.tabs.executeScript）。
2. 在注入的内容脚本中，定义一个onMessage 事件。
3. 在chrome.tabs.executeScript的回调函数中，执行以下步骤：
4. 使用var exec_error = setTimeout(onError, 100); 推迟onError 方法的执行。选择适当小的延迟 (100)，并将对此超时的引用保存在变量 exec_error 中。
5. 使用chrome.tabs.sendMessage(tabId, func) 向选项卡发送消息。
6. 在回调函数func中，添加如下逻辑：
  - 验证响应（事件不是由扩展的另一部分创建的吗？）
  - clearTimeout(exec_error)
  - onSuccess()
7. 发生错误时，2. 中定义的onMessage 事件将不会被注入。因此，选项卡将不会按预期响应，并且不会清除超时。 因此，onError 将被执行。
  否则，清除超时，并执行onSuccess。

代码（例如background脚本）：

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    // This event fires twice: loading, and complete.
    // If we're loading, terminate function, and wait for "complete"
    if (changeInfo.status === 'loading') return;

    // On error and on success, this happens:
    function onError() {
        console.log('Error injecting the content script!');
    }
    function onSuccess() {
        console.log('Successfully injected content script!');
    }

    // Execute scripts
    chrome.tabs.executeScript(tabId, {
        file: 'test_access.js'
    }, function() {
        // This function always fires *after* the attempt to run the code
        var exec_error = setTimeout(onError, 100);
        chrome.tabs.sendMessage(tabId, 'Are you there?', function(yes_no) {
            if (yes_no === 'Yes') {
                clearTimeout(exec_error);
                onSuccess();
            }
        });
    });
});

`test_access.js`

chrome.extension.onMessage.addListener(function(req, sender, respond) {
   if (req === 'Are you there?') {
       respond('Yes');
   }
});
// Rest of your content script's logic, eg:
alert(location.href);

【讨论】：

RobW 你是 chrome 扩展天才！
@CrisStringfellow 谢谢。我已更新答案以使用 sendMessage/onMessage 方法而不是 sendRequest/onRequest，因为自 Chrome 20 以来，后者已被弃用，取而代之的是前者。

【解决方案2】：

您不能通过扩展程序为具有chrome:// 之类的 URL 的页面加载脚本。但是，您可以完全override 某些页面，但不能在您将脚本加载到其他页面的同一扩展中。

【讨论】：