当前位置: 首页 > 图文教程 > 网络编程 > AJAX技术 > AJAX在GB2312的中文编码传输 AJAX特殊字符编码正确方法

AJAX技术
自己动手封装的 ajax
Ajax 对象 包含post和get两种异步传输方式
Ajax 超时检查脚本
AJAX 简介及入门实例
ajax 开发守则 10条说明
Ajax 返回字符串的过滤实现代码
Ajax 程序开发中常见问题
AJAX 验证框架13个
ajax 入门基础之 XMLHttpRequest对象总结
基于AJAX的分页类实现代码
如何在Asp.net中使用HtmlArea编辑器
使用 jQuery 简化 Ajax 开发
ASP.NET 与 Ajax 的实现方式
AJAX技术介绍
Ajax程序设计入门
学习Ajax教程,详细了解Get与Post
关于Ajax responseText 的一点阐述
ajax中文乱码解决方法
AJAX中文问题总结
AJAX无刷新更新数据

AJAX技术 中的 AJAX在GB2312的中文编码传输 AJAX特殊字符编码正确方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-02-27   浏览: 136 ::
收藏到网摘: n/a

此文章为个人总结,花了近半天时间搜索、试验,在网上看到很多关于AJAX编码问题,不一而足 很多可能在转摘过程中失真或未经验证就被转摘,真正使用时却不行,也由此决定自己全方位试验一下,努力还是没有白费,虽然最终得出的结果是很简单的,但其过程对于一个新学AJAX的人来说,真是挺累。
欢迎您在使用过程中对新的心得一起跟帖交流,一个思想+一个思想,至少可以产生两个思想。
一、在GET发送时:
方法1:在ASP服务器端用Response.charset="GB2312"界定输出编码给调用客户端
此时客户端不需要做什么转换即可。如下两个文件:
1、客户端JS
复制代码 代码如下:

var xmlHttp;
function createXML(){
if(window.ActiveXObject){
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}
}
function startXml(){
createXML();
xmlHttp.onreadystatechange = handleStateChange;
var url="ajaxtext.asp?tm=1&cc"+Math.random();
//var sendContents = 'theinput='+escape(theinput.value);
var regcode="2abc";
xmlHttp.open("get",url,true);
//regcode="regcode="+regcode;
//xmlHttp.setrequestheader("content-length",regcode.length); //可加可不加
//xmlHttp.setRequestHeader("Cache-Control","no-cache");
//xmlHttp.setRequestHeader('Content-type','application/x-www-form-urlencoded'); //可不加
//xmlHttp.send(null);
//xmlHttp.send("regcode="+escape(regcode));
xmlHttp.send(null);
}
function handleStateChange(){
if (xmlHttp.readyState == 4 && xmlHttp.status==200){
//var divid=document.getElementById("results");
retext=xmlHttp.responseText;
alert(retext);
//if(divid.hasChildNodes()){
// divid.removeChild(divid.childNodes[0]);
//}
//var result=document.createTextNode(xmlHttp.responseText);
//divid.appendChild(result);
//document.getElementById("results").innerHTML=xmlHttp.responseText;
}
}

服务器端:
复制代码 代码如下:

<%Response.CodePage=936%>
<%Response.charset="GB2312"
dim reg
reg=Request("regcode")
Response.write "王先生·和他的朋友" '可以正确输出。
%>

方法2:在客户端用函数转换(来自网上)。
复制代码 代码如下:

function gb2utf8(data){
var glbEncode = [];
gb2utf8_data = data;
execScript("gb2utf8_data = MidB(gb2utf8_data, 1)", "VBScript");
var t=escape(gb2utf8_data).replace(/%u/g,"").replace(/(.{2})(.{2})/g,"%$2%$1").replace(/%([A-Z].)%(.{2})/g,"@$1$2");
t=t.split("@");
var i=0,j=t.length,k;
while(++i<j) {
k=t[i].substring(0,4);
if(!glbEncode[k]) {
gb2utf8_char = eval("0x"+k);
execScript("gb2utf8_char = Chr(gb2utf8_char)", "VBScript");
glbEncode[k]=escape(gb2utf8_char).substring(1,6);
}
t[i]=glbEncode[k]+t[i].substring(4);
}
gb2utf8_data = gb2utf8_char = null;
return unescape(t.join("%"));
}

此时如果服务器端不指明编码,那么AJAX默认为UTF-8,就不能在客户端显示,用这个函数就可以。
复制代码 代码如下:

retext=xmlHttp.responseText;
retext=gb2utf8(retext);
alert(retext);

3、在火狐浏览器下:具体请参考:下一篇文章
火狐比较简单,他可以支持xmlHttp.responseText;//FireFox,但为了代码简化,建议用上面的直接做好编码。
但如果为了通用,就按POST下面介绍的方法来做吧。
二、在POST发送时:
对于常规的中文,上述的GET方法在POST也是可以的,但网上有一篇文章提到了部分符号不能显示的,比如:下一篇文章中的“test·test+test·”,(中间是间隔号)测试过了,的确在服务器端界定编码后输出给客户端也不能显示。
如果按照文中所说的,
发送端用xmlHttp.send("regcode="+escape(regcode));
然后在服务器端将接收的数据套上两个编码encodeURIComponent(escape(xxxxxxx)),则显示的结果是:test%25u7A5Eest%2520test,同样不行。另外这个思路应是不对的,不知道这篇文章在网上被转抄时是否本身就有错,按理在客户端用escape编码传送后,在服务器端就应该反编码。或者REQUEST本身就有解码的作用。不需要再二次、三次编码。况且查了一下,escape和encodeURIComponent也无法对特殊字符编码。
我在服务器端做了如下输出:
复制代码 代码如下:

test2="test·test+test·回馈:"
Response.write test2&"前面是服务器直接输出的而非接收的特殊符号“·”间隔号。后面是接收的数据(内容与原AJAX发送的一样,用于对比):"

也就是说直接在服务器端生成一个同样的含特殊字符,这个服务器端文件已经用<%Response.charset="GB2312"%>定义好编码为GB2312。但输出的结果是,在服务器端生成的test2="test·test+test·回馈:"可以正常输出,而接收的AJAX值就不行了。
即使在客户端用JS三个编码参数escape()\encodeURI() \encodeURIComponent() 全部试过去,然后在服务器商反编码再输出,也是不行。这说明字串中的特殊符号在服务器端接收时就已经变形了。
现在问题界定在编码传递上了,为了说明这个问题,我又做了一个小试验:就是把这个字串赋值给ASP的一个变量再用ASP变量来赋值给JS,如下:
复制代码 代码如下:

<%
para="test·test+test·/"
para=Server.urlencode(para)
%>

然后转手给JS变量,如下:
复制代码 代码如下:

xmlHttp.open("POST",url,true);
var regcode="<%=para%>";
xmlHttp.setRequestHeader('Content-type','application/x-www-form-urlencoded;charset=gb2312');
xmlHttp.send("regcode="+regcode);

结果正常了,这充分说明ASP的server.urlencode能完整对特殊字符编码。而JS还是有欠缺。
那现在怎么办?
在实在没办法的情况下,我想到了即然encodeURIComponent()可以比encode()对更多特殊字符编码,那么不妨像多重MD5加密一样,增加强化剂,于是我套用了两个encodeURIComponent(),现在代码是:
复制代码 代码如下:

var regcode="test·test+test·/";
xmlHttp.setRequestHeader('Content-type','application/x-www-form-urlencoded;charset=gb2312');
xmlHttp.send("regcode="+encodeURIComponent(encodeURIComponent(regcode)));

上面是客户端的,再把服务器端改成:
复制代码 代码如下:

<script language="javascript" runat="server">
function decodestr(str){
return decodeURIComponent(decodeURIComponent(str));
}
</script>
<%
dim reg
reg=Request("regcode")
test2="test·test+test·回馈:"
Response.write test2&"前面是服务直接输入的而非接收的特殊符号“·”间隔号。后面是接收的数据(内容与原AJAX发送的一样,用于对比):"
Response.write decodestr(reg)
%>

终于完美看到了AJAX输出的特殊字符。间隔号和+号都出来了,
“test·test+test·/”
为了进一步验证,我把下面encodeURIComponent也无法编码的个别特殊字符全加进来了,如下:
复制代码 代码如下:

var regcode="汉字开头:! @ # $& * ( ··) = : / ; ? + 结尾,中间全是特殊字符。";

结果也正常了,太棒!
不过一般AJAX传给服务器的数据是要应用的,否则没有意义,为了再进一步验证数据是否一样,我把服务器端做了小修改,如下:
复制代码 代码如下:

<%
dim reg
reg=Request("regcode")
test2="汉字开头:! @ # $& * ( ··) = : / ; ? + 结尾,中间全是特殊字符。"
IF test2<>decodestr(reg) Then
Response.write "不同"
Else
Response.write "相同"
End IF
%>

很兴奋。客户端输出“相同”,这下可以放心全面应用了。
总结:
1、AJAX客户端双重套用encodeURIComponent()对POST的数据编码。
2、服务器端对应地用decodeURIComponent()双重解码即可:
<script language="javascript" runat="server">
function decodestr(str){
return decodeURIComponent(decodeURIComponent(str));
}
</script>
3、在接收responseText时,不需要再反编码了。直接:retext=xmlHttp.responseText;
4、服务器端的这行仍然不可缺:<%Response.charset="GB2312"%>,一般在ASP文件中,都有<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>这行,但这行可以去掉,唯独不能去掉<%Response.charset="GB2312"%>,否则出错。
现在开始,把encodeURIComponent()/decodeURIComponent()背熟就可以。
附:以下几个编码方法摘自JS手册,供参考:
escape() 方法:
采用ISO Latin字符集对指定的字符串进行编码。所有的空格符、标点符号、特殊字符以及其他非ASCII字符都将被转化成%xx格式的字符编码(xx等于该字符在字符集表里面的编码的16进制数字)。比如,空格符对应的编码是%20。unescape方法与此相反。不会被此方法编码的字符: @ * / +
注释:可以使用 unescape() 对 escape() 编码的字符串进行解码。但ECMAScript v3 反对使用这种方法,应用使用 decodeURI() 和 decodeURIComponent() 替代它。
encodeURI() 方法: ------ 注意后面一个是大小的i——“I”不是L,下面的decodeURI也不是L。
把URI字符串采用UTF-8编码格式转化成escape格式的字符串。不会被此方法编码的字符:! @ # $& * ( ) = : / ; ? + '
encodeURIComponent() 方法:
把URI字符串采用UTF-8编码格式转化成escape格式的字符串。与encodeURI()相比,这个方法将对更多的字符进行编码,比如 / 等字符。所以如果字符串里面包含了URI的几个部分的话,不能用这个方法来进行编码,否则 / 字符被编码之后URL将显示错误。不会被此方法编码的字符:! * ( )

引用内容
因此,对于中文字符串来说,如果不希望把字符串编码格式转化成UTF-8格式的(比如原页面和目标页面的charset是一致的时候),只需要使用escape。如果你的页面是GB2312或者其他的编码,而接受参数的页面是UTF-8编码的,就要采用encodeURI或者encodeURIComponent。
另外,encodeURI/encodeURIComponent是在javascript1.5之后引进的,escape则在javascript1.0版本就有。
decodeURI() 函数
decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。
<script type="text/javascript">
var test1=http://www.w3school.com.cn/My first/
document.write(encodeURI(test1)+ "<br />")
document.write(decodeURI(test1))
</script>
decodeURIComponent() 函数:可对 encodeURIComponent() 函数编码的 URI 进行解码。
unescape():对escape解码。
作者:非物理生命博客traindiy