cross browser solution for listening to requests and capturing screenshots

I need to create a plugin/extension/bookmarklet/greasemonkey script that allows the user to capture arbitrary requests and send them back to a web service with s开发者_高级运维ome tags. For example, the user would get to a page and click "capture", and they would be presented with a dialog asking them for some tags and/or a description and then the current window location would be sent off to a web service. Here's the catch:

1. The user should also be able to view async requests and 'capture' them the same way they can capture the window location

2. The user should be able to capture a screenshot of their current page and send that back through the web service

Given these last two complications I am leaning towards a browser plugin as the solution (probably firefox, since low-level http stuff seems to be better supported than in chrome), but I am wondering if anyone has an idea for a more cross-browser-y solution, and or if there is something out there that might provide a good API for this kind of thing.

There won't be a cross-browser solution that allows capturing all requests. For Firefox you would implement the nsIContentPolicy interface and register your component in the content-policy category. For Chrome you would need the experimental webRequest API (the beforeload event in WebKit browsers will sort of do the same thing but it won't capture everything, it also has severe side-effects).

As to webpage screenshots, this is possible in Firefox extensions by using the HTML <canvas> tag and calling drawWindow method. You can then export the data via canvas.toDataURL(). I am not aware of any alternatives for WebKit browsers. chrome.tabs.captureVisibleTab() allows doing the same thing in Chrome.