ajax 数据传递中的乱码问题

来源：互联网发布：用ant执行sql 语句编辑：程序博客网时间：2024/06/05 17:28

最近做一个小项目，碰到这个问题，很让人恼火。

用的是ajax+jsp+struts 的结构

js代码如下：

//创建XMLHttpRequest对象         
    function createXMLHttpRequest() {
        if(window.XMLHttpRequest) { //Mozilla 浏览器 
            XMLHttpReq = new XMLHttpRequest();
        }
        else if (window.ActiveXObject) { //IE浏览器 
            try {
                XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
            }
        }
    }
//发送页面请求函数 
    function sendDataRequest(){
        var url = "/resetPage.action?doing=buttonVal";
        createXMLHttpRequest();
        XMLHttpReq.open("GET", url, true);
        XMLHttpReq.setRequestHeader( "Content-Type", "text/html;charset=GBK" );
        XMLHttpReq.onreadystatechange = processDataResponse;//指定响应函数 
        XMLHttpReq.send(null);  //发送请求 
    }
    
    //处理返回的信息 
    function processDataResponse() {
        if (XMLHttpReq.readyState == 4) { //判断对象状态 
            if (XMLHttpReq.status == 200) { //信息已经成功返回，开始处理信息 
                updateButton();
            } else { //页面不正常 
                alert("您所请求的页面有异常");
            }
        }
    }
function updateButton() {
    var str =XMLHttpReq.responseText; 
    alert(str);
}

java代码：

public ActionForward buttonVal ActionMapping mapping, ActionForm form,  HttpServletRequest request, HttpServletResponse response)throws Exception {
            String str ="返回";
            //传回响应数据 
            PrintWriter out=response.getWriter();
            response.setContentType("text/html; charset=GBK");
            response.setHeader("Cache-Control", "no-cache");
            response.setCharacterEncoding("UTF-8");
            System.out.println("===response CharacterEncoding==="+response.getCharacterEncoding());
            System.out.println("===response==ContentType==="+response.getContentType());
            out.write(str);
            out.close(); 
        return mapping.findForward(null);
    }

我的jsp代码里的编码<%@ page contentType="text/html; charset=GBK"%>

现在问题来了，返回的str总是??，baidu、Google 都是下面的解决办法：

Answer 1：

用AJAX来GET回一个页面时，responseText里面的中文多半会出现乱码，这是因为XMLHttp在处理返回的responseText的时候，是把resposeBody按UTF-8编码进解码考形成的，如果服务器送出的确实是UTF-8的数据流的时候汉字会正确显示，而送出了GBK编码流的时候就乱了。解决的办法就是在送出的流里面加一个Header，指明送出的是什么编码流，这样XMLHttp就不会乱搞了。
PHP:header(’Content-Type:text/html;charset=GB2312′);
ASP:Response.Charset(”GB2312″)
JSP:response.setHeader(”Charset”,”GB2312″);

Answer 2：

        自己在js里写一个转码的函数。可以参考vbscript的实现。
        以下是一段参考代码：

<script language="vbscript"> 
    Function str2asc(strstr) 
        str2asc = hex(asc(strstr)) 
    End Function 
    Function asc2str(ascasc) 
        asc2str = chr(ascasc) 
    End Function 
</script> 

Answer 3：

xtmlhttp 返回的数据默认的字符编码是utf-8,所以服务器要向客户端发送数据的时候,也要采用utf-8编码.如果上述方法仍然解决不了乱码问题,那你尝试一下把jsp,htm,java文件用UTF-8编码格式保存.

我尝试用方法1中的解决办法，在java代码中处理返回数据时添加了response.setHeader(”Charset”,”GBK″);没有效果！试了几种编码方式都不行。郁闷！。。。

在java的systemout 中打出来的log如下：

===response CharacterEncoding===ISO-8859-1
===response==ContentType===text/html;charset=ISO-8859-1

看了这个log无语了，在java代码里的设置没有起作用！！看来是在Action中的HttpServletResponse response参数就已设置了 CharacterEncoding，后面的修改都不起作用。

偶然在网上看到一个关于javascript 的函数 escape ，然后Google了下，发现这个函数有点用，可以对字符进行转码，现在理解相当于是给你的字符加了层外壳。那在传值的时候就可以用escape“包装”下你的request的中文字符，传给后台java代码，然后在后台接收的时候，用unescape解开“包装”。处理完毕返回response的时候，在把处理好的数据用escape“包装”起来，这样在ajax的js代码中，我们就可以再使用unescape解开处理好的“数据包”。按照这个思路，成功解决了ajax传值的中文乱码问题！（呼~ 总算解决了，郁闷好多天了）。

下面是后台java代码中要用到的escape、Unescape。可以编写一个类，专门存放

public class EscapeUnescape {
    
    public static String  escape (String src)    
     {    
         int i;    
         char j;    
         StringBuffer tmp = new StringBuffer();    
         tmp.ensureCapacity(src.length() * 6);    
       
         for (i = 0; i < src.length(); i++) {    
             j = src.charAt(i);    
             if (Character.isDigit(j) || Character.isLowerCase(j) ||    
                 Character.isUpperCase(j))    
                 tmp.append(j);    
             else {    
                 if (j < 256) {    
                     tmp.append("%");    
                     if (j < 16)    
                         tmp.append("0");    
                     tmp.append(Integer.toString(j, 16));    
                 } else {    
                     tmp.append("%u");    
                     tmp.append(Integer.toString(j, 16));    
                 }    
             }    
         }    
         return tmp.toString();    
     }    
       
     public static String  unescape (String src)    
     {    
         StringBuffer tmp = new StringBuffer();    
         tmp.ensureCapacity(src.length());    
         int lastPos = 0, pos = 0;    
         char ch;    
         while (lastPos < src.length()) {    
             pos = src.indexOf("%", lastPos);    
             if (pos == lastPos) {    
                 if (src.charAt(pos + 1) == 'u') {    
                     ch = (char) Integer.parseInt(src.substring(pos + 2, pos + 6),    
                                                  16);    
                     tmp.append(ch);    
                     lastPos = pos + 6;    
                 } else {    
                     ch = (char) Integer.parseInt(src.substring(pos + 1, pos + 3),16);    
                     tmp.append(ch);    
                     lastPos = pos + 3;    
                 }    
             } else {    
                 if (pos == -1) {    
                     tmp.append(src.substring(lastPos));    
                     lastPos = src.length();    
                 } else {    
                     tmp.append(src.substring(lastPos, pos));    
                     lastPos = pos;    
                 }    
             }    
         }    
         return tmp.toString();    
     }    
}

JavaScript 中可以直接使用escape和Unescape。

方法2、3有点复杂，增加了代码量和修改量，暂时不做考虑。

至此，终于对这个问题有了个交代，现在写出来，希望能给大家做个参考，同时，代码比较简单，写的比较仓促，希望大家多多提意见，有好的方法一起探讨。