"XMLHttpRequest Tracing" for AJAX debugging
Its purpose is to help peek into AJAX applications, to learning or troubleshooting, without having to run a network sniffer.
This screenshot shows a sample output (Google Suggest). Each XMLHttpRequest instance is assigned a random ID (781 in this example) that allows you to track multiple requests being run in parallel.
It's a pretty early version, so feel free to send some suggestions and feedback.
It doesn't work on GMail. I'm not sure why yet (any pointers appreciated ;-).
Thanks to the anonymous contributor that posted that idea in the Greasemonkey user script requests page.
Update (2005/06/02): I just posted a new and re-vamped script for XMLHttpRequest debugging. It implements some debugging features beyond simply tracing, such as editing and replaying requests.
Update (2005/07/10): Due to security reasons, the GM_* functions were removed from Greasemonkey 0.3.5 until a more secure design is found. The XMLHttpRequest Tracing script requires the GM_log function and therefore won't work at all on these "neutered" versions of Greasemonkey.
Update (2006/01/12): Fixed script to work in Firefox 1.5 with Greasemonkey 0.6.4. It's probably broken for older version thought.______________________________________
I tried it for www.backpackit.com, and it made it so that Backpack would no longer accept my updates.
Sage, I just tried it on backpackit.com and I didn't have any problem (updates are working).
What specific operation is not working?
I tried adding an item to a list and the little spiraling "pending" circle icon just kept spinning. Same thing when I tried to add a note.
I thought maybe it was making a server call to this site and that was slowing it down, but I let it run for a couple of minutes and nothing happened.
I also noticed that when I tried to delete items, they disappear as if it worked correctly, but when I refresh or login with a different browser the items are actually still there.
This is a nice exercise, but why not just use Live HTTP Headers?Posted by: Adrian H. (May 11, 2005 09:48 AM) ______________________________________
Adrian, Live HTTP Headers is most useful. But it only shows the headers, whereas this user script also shows the body of the response, which is quite useful in AJAX applications.
I'm thinking of adding some XMLHttpRequest debugging features that go beyond simply tracing (if an implementation is possible):
- in that interface, let users replay callbacks (maybe allowing to modify the response body).
- let users intercept (breakpoint) and modify requests and responses as they go .
Ah, that makes sense -- thanks for the clarification!Posted by: Adrian H. (May 11, 2005 10:56 AM) ______________________________________
Sage, I'm still trying to repro this problem.
What OS and browser versions are you running?
What is the url that is needed to be added to the greasemonkey script?
I am just starting out with greasemonkey and I tried with the following link
but the JS console shows no outputPosted by: makash (May 11, 2005 10:15 PM) ______________________________________
Hey Sage. Same platform as me.
Makash, the main Google search page doesn't use XMLHttpRequest. Try Google Suggest instead, at http://www.google.com/webhp?complete=1
So, I added Feedmarker.com and sproutliner.com to the Greasemonkey script to try those sites. I get the following errors. In Sproutliner:
Error: GM_log is not defined
Source File: http://sproutliner.com/
And in Feedmarker.com:
Client_Error:ReferenceError:GM_log is not defined.
Sage, thanks for taking the time to troubleshoot this with me. I think that pinpoints the problem: you need Greasemonkey 0.3 and up. The GM_log function didn't exist before that.
I'll update the XMLHttpRequestTracing script to issue a warning when it detects an older version of Greasemonkey.
Sorry about that.
Glad to help!Posted by: Sage (May 12, 2005 11:29 AM) ______________________________________
Have you tried Fiddler www.fiddlertool.comPosted by: asdasd (May 19, 2005 04:23 AM) ______________________________________
I have used Fiddler tool and a number of other HTTP sniffers.
The next version of the user script (coming soon) goes beyond simply sniffing, with some features that I think are useful for AJAX debugging.
Feature suggestions are welcome too :-)
im using gm0.3.3 + ff 1.04 and i installed the script, but now whenever i open any webpage, i get the following error message in the js console
Error: illegal character
if i disable your xmlhttp tracer script, i dont get the error.
very weird...Posted by: steve (June 14, 2005 11:24 AM) ______________________________________
Thank you, Julien. This script has made my life so much easier.Posted by: Nathaniel (August 10, 2005 12:01 PM) ______________________________________
Hi, can you explain how to install this? I'd love to try it but I'm new to Greasemonkey.
Thanks.Posted by: Beth (November 8, 2005 09:31 AM) ______________________________________
Thanks again!Posted by: Beth (November 8, 2005 09:59 AM) ______________________________________
Beth, you need to configure the list of trigger urls for the script so that the script gets run on the pages you want to analyze.
Then you navigate to one of these pages and at that point you should see tracing information appear in the console.
Beth, you need to configure the list of trigger urls for the script so that the script gets run on the pages you want to analyze.Posted by: acura (December 7, 2005 04:24 PM) ______________________________________
Just occasionally got here, but thaks for the script. A pretty neat tool.Posted by: AJ (December 14, 2005 02:26 PM) ______________________________________
Actually i have a question related to AJAX technology that I want to ask with all of you.
My question is: Can we update database values using Ajax? I have search over the internet but I haven't got any solution regarding upadting database values using Ajax.
I am ASP.NET Developer and looking forward for your suggestion regarding my question.
Thanks in Advance.Posted by: Anand (January 1, 2006 05:08 AM) ______________________________________
Anand, nothing prevents you from updating a database using AJAX.
But you still need to write C# code that does the database update, given some parameters passed from the client.
I just updated the script to run in Firefox 1.5 and Greasemonkey 0.6.4. Older versions are not supported anymore.Posted by: Julien Couvreur (January 13, 2006 10:51 AM) ______________________________________
Thanks for this great post. You've got some really good info in your blog.
Great reading, keep up the great posts.