前言:
当jquery ajax在utf-8编码下(页面utf-8,接收utf-8),无任何问题。可以正常post、get,处理页面直接获取正确的内容。
但在以下情况下:
GBK -> AJAX POST ->GBK
UTF-8 -> AJAX POST ->GBK
后台代码无法获取正确的内容,通常表现为获取到奇怪字符、问号。
经典解决方法:
1:发送页面、接收页面均采用UTF-8编码。
2:发送页面在调用ajax post方法之前,将含有中文内容的input用encodeURIComponent编码一次,而接收页面则调用解码方法( 如:java.net.urldecoder.decode("接收到内容","utf-8") )。
其中,第一种方法无疑是最简单、最直接,但往往不符合实际,因为很多项目并不是使用utf-8编码,例如国内大部分使用gbk编码,也不可能为了解决这样一个问题,而将整个项目转换为utf-8编码,成本太大,风险太高。
第二方法,是现在最多人使用的方法,俗称二次编码,为什么叫二次编码,等下会解释。客户端编码两次,服务端解码两次。但这种方法不好的地方,就是前台手动编码一次,后台再手动解码一次,稍不留神就会忘记,而且代码掺和前台逻辑。
交互过程:
当我们使用表单按照传统方式post提交时候(非AJAX提交),浏览器会根据当前页面编码,encode一次,然后发送到服务端,服务端接收到表单,会自动dencode一次,通常这个过程是对程序是透明的,因此加上手动编码、解码,就变成上面所说的二次编码。
但当我们使用AJAX方式提交时候,浏览器并不会自动替我们encode,因此在jquery中有这样的一段代码:
ajax: function( s ) {
// Extend the settings, but re-extend 's' so that it can be
// checked again later (in the test suite, specifically)
s = jQuery.extend(true, s, jQuery.extend(true, {}, jQuery.ajaxSettings, s));
var jsonp, jsre = /=?(&|$)/g, status, data,
type = s.type.toUpperCase();
// convert data if not already a string
if ( s.data && s.processData && typeof s.data !== "string" )
s.data = jQuery.param(s.data);
![](http://hiphotos.baidu.com/oswlh/pic/item/65083509b3ac929d3ac7637e.jpg)
..
}
以上是jquery的ajax方法的代码片段,下面是正常调用jquery ajax post的代码:
$.ajax({
url: ajaxurl,
type: 'POST',
dataType: 'html',
timeout: 20000,//超时时间设定
data:para,//参数设置
success: function(html){
}
});
通过上面代码可以知道,当设置了data时候,jquery内部会调用jQuery.param方法对参数encode(执行本应浏览器处理的encode)。
jQuery.param=function( a ) {
var s = [ ];
function add( key, value ){
s[ s.length ] = encodeURIComponent(key) + '=' + encodeURIComponent(value);
};
// If an array was passed in, assume that it is an array
// of form elements
if ( jQuery.isArray(a) || a.jquery )
// Serialize the form elements
jQuery.each( a, function(){
add( this.name, this.value );
});
// Otherwise, assume that it's an object of key/value pairs
else
// Serialize the key/values
for ( var j in a )
// If the value is an array then the key names need to be repeated
if ( jQuery.isArray(a[j]) )
jQuery.each( a[j], function(){
add( j, this );
});
else
add( j, jQuery.isFunction(a[j]) ? a[j]() : a[j] );
// Return the resulting serialization
return s.join("&").replace(/%20/g, "+");
}//jquery.param end
上面是jQuery.param的代码,细心点可以留意到encodeURIComponent这方法,这是javascript内置的方法,对目标字符串执行utf-8 encode,因此,当页面使用gbk编码时候,服务端会使用gbk进行解码,但实际提交的数据是以utf-8编码的,所以造成接收到内容为乱码或者为问号。
解决方法:
encodeURIComponent会以utf-8编码,在gbk编码下,可不可以以gbk进行编码呢?
如果还在打encodeURIComponent主意的话,那不好意思,encodeURIComponent只会utf-8编码,并没有其他api进行其他编码;不过,别担心,看看下面:
encodeURIComponent,它是将中文、韩文等特殊字符转换成utf-8格式的url编码。
escape对0-255以外的unicode值进行编码时输出%u****格式,其它情况下escape,encodeURI,encodeURIComponent编码结果相同。
哈哈,看到希望吧?没错,就是用escape代替encodeURIComponent方法,不过必须注意:
escape不编码字符有69个:*,+,-,.,/,@,_,0-9,a-z,A-Z
encodeURIComponent不编码字符有71个:!, ',(,),*,-,.,_,~,0-9,a-z,A-Z
使用了escape之后必须对加号进行编码,否则,当内容含有加号时候会被服务端翻译为空格。
终于知道解决办法了,重写jquery代码:
jQuery.param=function( a ) {
var s = [ ];
var encode=function(str){
str=escape(str);
str=str.replace(/+/g,"%u002B");
return str;
};
function add( key, value ){
s[ s.length ] = encode(key) + '=' + encode(value);
};
// If an array was passed in, assume that it is an array
// of form elements
if ( jQuery.isArray(a) || a.jquery )
// Serialize the form elements
jQuery.each( a, function(){
add( this.name, this.value );
});
// Otherwise, assume that it's an object of key/value pairs
else
// Serialize the key/values
for ( var j in a )
// If the value is an array then the key names need to be repeated
if ( jQuery.isArray(a[j]) )
jQuery.each( a[j], function(){
add( j, this );
});
else
add( j, jQuery.isFunction(a[j]) ? a[j]() : a[j] );
// Return the resulting serialization
return s.join("&").replace(/%20/g, "+");
}
上面那段代码并不需要在jquery的源文件重写,可以在你项目的javascript贴上,覆盖它原有的方法,不过必须在jquery加载之后。
经初步验证,上面那段代码在utf-8编码也可以工作正常,大概是编码成unicode的缘故吧。
这样,就不是需要使用什么二次编码,即影响前台,又影响后台。gbk编码下ajax post不再是问题了。
分享到:
相关推荐
前端页面通过ajax发送请求,参数都是默认使用utf-8编码格式对参数进行url编码,这样的后果就是,当后台页面如果使用gbk编码的话,会出现乱码的情况,然后网上找到一个大神写的gbk.js. 但是里面没有做出详细介绍,这里...
客户端是UTF-8编码,这也是现在大家公认的标准编码 在这种情况下,实用AJAX异步获取GB2312编码的服务器端信息时,不可避免的要遇到汉字乱码问题 因为目标数据是GB2312,但XMLHttpRequest默认是用UTF-8来进行数据封装...
数据视图UTF-8 用于将ArrayBuffer转换为utf-8字符串的Javascript方法如何使用? 您将必须在项目中添加utf8.js文件。 我假设您已经从websocket或ajax输入了缓冲区var dataview = new DataView(buffer); dataview....
源代码-ajax n级联动数据库版(带后台和省市县数据库) utf-8.zip
ASP源码—ajax n级联动数据库版(带后台和省市县数据库) utf-8.zip
基于ASP的ajax n级联动数据库版(带后台和省市县数据库) utf-8.zip
ASP实例开发源码—ajax n级联动数据库版(带后台和省市县数据库) utf-8.zip
ssm_ajaxsubmit-ajax提交-模态对话框-ajax上传文件
asp无组件上传类v0.98(无刷新ajax上传,可检查图片木马,支持多文件,utf-8版) 请将本程序放到你的虚拟主机上运行,如果本地有iis也可以。有些同学有简易iis服务器,不适用本程序的,因为有部分中文字符不能识别...
微标ASP上传类 v1.3(无刷新、无组件、多文件上传,并且可查杀木马,utf-8格式) 请将本程序放到你的虚拟主机上运行,如果本地有iis也可以(注意定要把iis那儿的上传大小限制的200k改大点,参考下面第二点)。...
5. GB2312和UTF8两种版本, 方便用户在不同编码格式的网页中调用; 6. 客服人员分组管理, 无限制添加客服人员; 7. 新信息窗口闪动, 信息提示声音, 颜色, 表情符号等; 8. 使用简单, 操作方便, 占用系统资源少, 交互...
两个问题: 第一题: xmlhttp 的 responseText 默认总是utf-8的编码,前段时间为了以最小成本解决这个问题,索性整个项目用utf-8编码。网上解决的方法不多,而且都是比较乱七八糟的,不喜欢。又不能以后所有都用utf-...
演示程序实现了省、市、县三级联动(ajax技术) 程序调用方法: 1:把 <script language="javascript" src="js/jquery.js"></script> <script language="javascript" src="js/firste_city.js"></script> 贴到网页...
您可以对产品进行排序,导航到下一页和上一页,而无需重新加载该页。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新...
dojo-0.3.1-ajax
Ajax-ajax-contact-form-wordpress.zip,wordpress的联系人表单,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新加载...
charset=utf-8"); ajax.send("Action=ReviewSave&id="+id+"&Content="+escape(Content)); ajax.onreadystatechange = function(){ if (ajax.readyState == 4){getinfo = ajax.responseText; if(getinfo!=""){...
ajax课件--------Ajax.ppt,绝对经典,放心下载!
客户可以很容易地选择可配置的选项并在弹出窗口中编辑项目,而不会浪费重新加载页面的时间。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,...
Ajax-ember-ajax.zip,在ember应用程序中发出ajax请求的服务,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新加载网页的...