My Goal
To write a browser extension which can use the webRequest
permission. It needs to listen to the onResponseStarted
event and read the response headers for the Content-Type
. Based on specific content types, it will inject a content script that changes the content on the page.
Also, if there is an easier way to get the response headers, that would be preferred over getting this to work. See below for what I've already found.
My current position
Since I have only started on the extension, it is very simple. This is my manifest.json
{
// ... clutter like name and version removed ...
"manifest_version": 3,
"author": "Lakshya Raj",
"background": {
"service_worker": "handler.js"
},
"permissions": [
"webRequest"
]
}
And my handler.js
chrome.webRequest.onResponseStarted.addListener(function(details){
console.log(details);
});
I am on Windows 10, Google Chrome Version 103.0.5060.134 (Official Build) (64-bit).
Error(s)
In the extensions page, there are two errors listed for my extension (installed via "load unpacked")
(Warning) Service Worker Registration Failed. This shows a preview of my extension manifest with the text
"handler.js"
highlighted. No other information is provided.(Error) Uncaught TypeError: No Matching Signature. This has two sections, context and stack trace. The content reads "extensions::webRequestEvent" (without formatting), while stack trace reads "Nothing to see here, move along."
Those aren't very useful error messages (at least to me), but that's all it says. I'm assuming someone on Stack Overflow has come upon this before and has a solution.
What I'm expecting
I expect that the details
to be logged into the console when I navigate to a page, say https://stackoverflow.com/robots.txt. When the service worker is registered without errors, I can visit the extensions page page and click the link that reads "service worker". That takes me to the console where the output appears.
Stuff I've already researched
Apparently, it is really difficult to get response headers, but on continual search, I came upon this extension called Charset. Charset is able to get the response headers (as part of the functionality code), and it uses webRequest
to do so. For this reason, I am trying the webRequest
permission in my code. I also looked through the webRequest
documentation and did a few unsuccessful Google searches.