jQuery append some weird string into the data submitted
Code to reproduce the bug (Put the following code in the html page and read the data submitted in Fiddler. jQuery 1.4.2 works fine, the problem happens in 1.5.1 and 1.5.2):
<html>
<head>
<script src="https://github.com/douglascrockford/JSON-js/raw/master/json2.js">&开发者_如何学运维lt;/script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script>
var data = { "Name": "test??", "testDesc": "testdesc??"};
$.ajax({
url: "submit.aspx/SubmitData",
data: JSON.stringify(data),
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false
}).success(function (msg) {});
</script>
</head>
<body></body>
</html>
I am using jQuery 1.5.1 for data processing and submit data to the server
function test(name, testDesc){
var data = { "Name": name, "testDesc": testDesc};
$.ajax({
url: "submit.aspx/SubmitData",
data: JSON.stringify(data),
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false
}).success(function (msg) {//......});
}
Among one thousand records, there are a few records with string like 'jQuery151023383707909744822_1301931324827' and 'jQuery151033911434971578497_1301989384660' in the data.
Is that the bug of jQuery or any plugins that causes the problem?
More information: The weird string seems replace the original "?" in those records. For example, Do you like StackOverflowjQuery151023383707909744822_1301931324827 I love it very much. Is this goodjQuery151023383707909744822_1301931324827 It's great.
Update for the bug: I have reproduced a case for the bug. If I input "test??" for the name, the submitted data becomes "{"Name":"testjQuery15103933552800185728_1302170988810","Description":"fdsa"}"
Update:
Looks like a bug in jQuery to me It is a bug in jQuery, specifically bug #8417, which was reported about five weeks ago, closed erroneously, then reopened and there's now a pull request with a fix pending; hopefully the fix will make a future version.
Workaround below, but first: This code replicates it in isolation:
jQuery(function($) {
$('#theButton').click(function go() {
var data = { "Name": "test??", "testDesc": "description"};
$.ajax({
url: "/icece5",
data: JSON.stringify(data),
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false
});
});
});
Live copy
Although we can't see the result of the POST on jsbin.com, we don't care, because it's what we're sending to the server that we're worried about. If I send that and look at the request in Chrome's dev tools, I clearly see the data being corrupted with the JSON-P callback name described below.
Interestingly, it doesn't happen if we don't tell jQuery we're expecting JSON back from the server (note the commented out line):
jQuery(function($) {
$('#theButton').click(function go() {
var data = { "Name": "test??", "testDesc": "description"};
$.ajax({
url: "/icece5",
data: JSON.stringify(data),
type: "POST",
contentType: "application/json; charset=utf-8",
//dataType: "json",
cache: false
});
});
});
Live copy
The type of the data being returned shouldn't affect what it does with the data we're sending, I wouldn't have thought. But it does invite a workaround:
Workaround
var data = { "Name": "test??", "testDesc": "testdesc??"};
$.ajax({
url: "submit.aspx/SubmitData",
data: JSON.stringify(data),
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "text", // <== Tell jQuery you expect plain text
cache: false
}).success(function (data) {
data = jQuery.parseJSON(data); // <=== Then parse it yourself
});
Recommend putting together a test case on jsFiddle.net and reporting it to the jQuery team, since you're the person with the real-life problem with it. If it's really a bug, they'll fix it; if not, I'd be interested to know why not...
Original answer:
The code you've quoted is doing a POST
of JSON-encoded data, but the strings you've mentioned (jQuery151023383707909744822_1301931324827
, etc.) are the jQuery "expando" (which is determined at runtime by taking the jQuery version and adding a random value to it) plus _
plus an epoch value. jQuery creates strings in that form as the default names of JSON-P callback functions, as seen here:
Lines 1,326-1,329 of jQuery-1.5.1.js:
// Unique for each copy of jQuery on the page
// Non-digits removed to match rinlinejQuery
expando: "jQuery" + ( jQuery.fn.jquery + Math.random() ).replace( /\D/g, "" ),
and (lines 7,029-7,035):
// Default jsonp settings
jQuery.ajaxSetup({
jsonp: "callback",
jsonpCallback: function() {
return jQuery.expando + "_" + ( jsc++ );
}
});
So my guess is that the code you're quoting isn't the code generating these values, but that you have other code using them.
The name of the JSON-P callback will replace the ?
in the URL of a request if you use JSON-P for the request. I wouldn't expect it to do that in your data.
I'd review your use of ajaxSettings
and such. If you switch to the un-minified version for debugging, you can also set a breakpoint in whatever debugger you use (and you use one, right? there's no excuse not to) on line 7,033 (where those strings are being created) and then step out to find out what part of your code is triggering it.
EDIT
This reply was posted to the initial question when not much info was available. Read @T.J. Crowder's reply to get the solution for this problem. It's a bug in jQuery and he's posted a workaround.
Original Reply
You've asked jquery to make sure the browser doesn't the request by passing cache: false
in your options array.
These unique strings are added at the end to make sure that each request is unique and is not cached. Don't worry about it.
精彩评论