Click here to Skip to main content
Click here to Skip to main content

jQuery 1.5 broke my JSONP request, and its my own damn fault.

, 5 Apr 2011
Rate this:
Please Sign up or sign in to vote.
jQuery has changed its implementation of how it creates JSONP requests in a way that can break some applications.
The Problem
Yesterday here at CodeProject Central, we tried to update to the latest and greatest version of jQuery. When we did, a very important JSONP request started to fail. There was a JavaScript parse error and the JSONP callback was not executed.
 
What I Saw
Using IE9 as well as Firebug, I looked at the request and response. What I found was that the remote server was responding with valid JSONP, but the browser was complaining that the wrapping JSONP callback function did not exist. Further examination showed that the returned JSONP wrapper method did not match the requested callback paramater.
 
Since we use caching a lot on the remote server I suspected a caching problem.
 
What I did Wrong
On the remote server, I was caching the entire response. I had observed that in jQuery 1.4.X, the callback function name in the request had the format of JSONPNNNNNN... So, prior to returning the cached response, I used some Regex magic to replace the cached method name with the name in the current request.
 
jQuery 1.5.1 has changed how it generates the callback function name by default. Now it has the format similar to jQuery15108338082315804084_1298857654378 which broke my magic Regex, so I was alway returning the cached data, including the old JSONP callback.
 
How I Fixed it
What I did to fix it required 2 changes:
1. Instead of caching the whole response, I only cache the JSON portion.
2. moved the code to wrap the JSON data in the JSONP callback to just before returning the response, after any cache calls.
 
What I learned, again
Don't build code on specific implementation details that are not fixed in stone. Here I assumed that the way jQuery generated callback names was fixed. It wasn't.
I fact, if I had specified the callback name, instead of passing "?", it would have failed.
Also, only cache what you need to.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Matthew Dennis
Software Developer (Senior) The Code Project
Canada Canada
Matthew works on improving the performance and experience of the Code Project site for users, clients, and administrators.
 
Matthew has more years of software develeopment, QA and architecture experience under his belt than he likes to admit. He gradutated for the University of Waterloo with a B.Sc. in Electrical Engineering. He started out developing micro-processor based hardware and software including compilers and operating systems.
His current focus is on .NET web development including jQuery, Webforms, MVC, AJAX, and patterns and practices for creating better websites.
He is the author of the Munq IOC, the fastest ASP.NET focused IOC Container.
His non-programming passions include golf, pool, curling, reading and building stuff for the house.
Follow on   Twitter

Comments and Discussions

 
GeneralReason for my vote of 5 nice one. PinmemberMonjurul Habib6-Apr-11 8:12 
Reason for my vote of 5
nice one.
GeneralReason for my vote of 5 Very useful developer notes, 5* PinmemberDrABELL5-Apr-11 14:40 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web04 | 2.8.140721.1 | Last Updated 5 Apr 2011
Article Copyright 2011 by Matthew Dennis
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid