To retrieve all the resources of a webpage through a Chrome extension, you can use the chrome.devtools.panels
API to create a DevTools panel to display the resources. Here is an example code:
// manifest.json
{
"name": "Webpage Resources",
"version": "1.0",
"description": "Retrieve all resources of a webpage",
"devtools_page": "panel.html",
"permissions": [
"devtools"
]
}
// panel.html
<!DOCTYPE html>
<html>
<head>
<title>Webpage Resources</title>
<script src="panel.js"></script>
</head>
<body>Resources:</body>
</html>
// panel.js
chrome.devtools.panels.create("Webpage Resources", null, "panel.html", function(panel) {
function updatePanel() {
chrome.devtools.inspectedWindow.getResources(function(resources) {
var resourcesList = document.createElement('ul');
resources.forEach(function(resource) {
var resourceItem = document.createElement('li');
resourceItem.textContent = resource.url;
resourcesList.appendChild(resourceItem);
});
document.body.appendChild(resourcesList);
});
}
panel.onShown.addListener(updatePanel);
});
This code creates a DevTools panel with the title "Webpage Resources" and a list to display the resources. When the panel is shown, it calls the chrome.devtools.inspectedWindow.getResources()
method to get all the resources of the inspected webpage, and then adds each resource URL to the list.
Please start posting anonymously - your entry will be published after you log in or create a new account. This space is reserved only for answers. If you would like to engage in a discussion, please instead post a comment under the question or an answer that you would like to discuss
Asked: 2023-02-09 11:00:00 +0000
Seen: 12 times
Last updated: May 04 '21
How can an array configuration be added to a VSCode extension?
How can distinct hovering effects be created for each word using the VSCode extension API?
How can I activate the notification windows or popups in Chrome extensions by clicking on them?
What is the method to turn off the Git extension that comes with VS Code?
How can I find the test tab in Azure DevOps if it cannot be located?
Is it impossible to install a package in VSCode in .deb format?
What is the method for accessing the logs of the Log Analytics agent extension for VMSS?
Is there a REPL available in the debugger extension of VS Code?
What is the method for supplying schema for command arguments in a vscode extension?
Is it impossible to record information in chrome.storage while using an extension?