AJAX-safe way to post-process / "wrap" arbitrary web pages?

Question

I manage a system for academic software projects which, as well as other things, allows projects to provide web pages integrated with an instance of the Trac bug tracker / wiki / source browser. The idea is that the users have freedom to design their main pages as they like (they really like that), but with some convenience/branding features like common navigation elements, and an (unobtrusive) link bar across the top to link back to the main page and other hosted projects. For want of a better word, I'm using "wrapping" to describe this inserting of nav elements and the link bar into the documents. I know, I know: overloaded terminology. Sorry if you were expecting a carriage-return question ;)

For several years this system has worked fairly nicely with the "wrapping" implemented by a user-defined Apache 2 OutputFilter for text/html: as the HTML stream leaves the server, I parse the input HTML into a DOM, normalize the tree a bit if needed, and then insert the appropriate extra elements. A bit scrappy, but the best way I could find, and so far it's worked well. However, I'm now wanting to upgrade the Trac system to 0.11, in which some neat AJAX is used to lazily render directory trees without reloading: the effect is that the AJAX HTML stream also gets modified by the Apache filter, so that there are new "top bars" and nav furniture added each time I open a directory. This is obviously pretty sucky, and I'd rather that my users could also use AJAX if they want, rather than hack in a Trac-specific "ignore the dir browsing HTTP requests" system.

What I want to know is whether anyone has a better way to apply such post-processing to web pages... particularly ways that will intrinsically play a bit nicer with AJAX, without restricting my users' freedom to do what they want with their pages. Thanks!

Answer 1

as the HTML stream leaves the server, I parse the input HTML into a DOM, normalize the tree a bit if needed, and then insert the appropriate extra elements.

I'm not familiar with this technique, so I must ask what exactly does the parsing? A language or is it a set of rules or what? If it's a language, you could check the headers of the request and if it is an AJAX request you could simply return the stream as is instead of adding the navigation.

Answer 2

What language are you using?

You're going to have a hard time doing this with DOM, as it easily changes..

Dare I say it.. Consider using regexes instead.