Question

chrome.devtools.network.getHAR 返回 0 个条目

2013-11-13

4531

google-chrome-extension google-chrome-devtools

我正在尝试构建 chrome 插件，我需要在其中捕获网页上触发的所有网络请求。我已阅读文档 @ http://developer.chrome.com/extensions/devtools_network.html

我正在使用

    chrome.devtools.network.getHAR(
    function(harLog) {
        alert(harLog.entries.length);

});

但每次我都得到 0 个条目，即使我尝试先打开面板并刷新网页也是如此。如果我遗漏了什么，有人可以帮忙吗？

我正在使用任何网页来测试这个，例如“ http://www.cnn.com/ ”，并在清单中将权限设置为

"permissions": [
    "http://*/*",
    "https://*/*"
  ]

Answer 1

您可以监听请求并根据 tabId 字段进行过滤。当然，您需要跟踪活动选项卡（每个窗口一个选项卡）。
例如：

使用 chrome.tabs.onActivated 监听每个窗口活动选项卡的变化，并将 tabId 存储在本地变量中。
使用 chrome.windows.onRemoved 停止跟踪已关闭窗口的选项卡。
为任何符合您目的的 chrome.webRequest.* 事件注册监听器。例如要在请求准备好发送时立即收到活动选项卡之一中任何请求的通知，请注册 chrome.webRequest.onBeforeRequest 的监听器。

下面是执行此操作的示例扩展的源代码。

manifest.json：

{
    "manifest_version": 2,
    "name":    "Test Extension",
    "version": "0.0",
    "offline_enabled": false,

    "background": {
        "persistent": true,
        "scripts": ["background.js"]
    },

    "permissions": [
        "webRequest",
        "*://*/*"
    ]
}

background.js：

/* Keep track of the active tab in each window */
var activeTabs = {};

chrome.tabs.onActivated.addListener(function(details) {
    activeTabs[details.windowId] = details.tabId;
});

/* Clear the corresponding entry, whenever a window is closed */
chrome.windows.onRemoved.addListener(function(winId) {
    delete(activeTabs[winId]);
});

/* Listen for web-requests and filter them */
chrome.webRequest.onBeforeRequest.addListener(function(details) {
    if (details.tabId == -1) {
        console.log("Skipping request from non-tabbed context...");
        return;
    }

    var notInteresting = Object.keys(activeTabs).every(function(key) {
        if (activeTabs[key] == details.tabId) {
            /* We are interested in this request */
            console.log("Check this out:", details);
            return false;
        } else {
            return true;
        }
    });

    if (notInteresting) {
        /* We are not interested in this request */
        console.log("Just ignore this one:", details);
    }
}, { urls: ["<all_urls>"] });

/* Get the active tabs in all currently open windows */
chrome.tabs.query({ active: true }, function(tabs) {
    tabs.forEach(function(tab) {
        activeTabs[tab.windowId] = tab.id;
    });
    console.log("activeTabs = ", activeTabs);
});

Answer 2

您需要等待页面下载完成后才能读取 HAR。请尝试以下操作：

var interval = setInterval( function() {
                   clearInterval(interval);
                   chrome.devtools.network.getHAR(
                          function(harLog) {
                              alert(harLog.entries.length);
                          });               
                    }, 5000 );

这将等待 5 秒钟后再读取 HAR。