(Spring + JSP + jQuery-AJAX + JSON)设置UTF-8问题的环境?

Hum*_*ing 10 java jquery spring utf-8

我做一个chat project在java与Spring 3.x该需求Multi-language support.

这就是我所做的.

我的JSP有:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%request.setCharacterEncoding("UTF-8"); %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
Run Code Online (Sandbox Code Playgroud)

我web.xml有:

<filter>
    <filter-name>characterEncodingFilter</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <init-param>
        <param-name>encoding</param-name>
        <param-value>UTF-8</param-value>
    </init-param>
    <init-param>
        <param-name>forceEncoding</param-name>
        <param-value>true</param-value>
    </init-param>
</filter>

<filter-mapping>
    <filter-name>characterEncodingFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>
Run Code Online (Sandbox Code Playgroud)

在我的Tomcat server.xml:

  <Connector (...) URIEncoding="UTF-8" />
Run Code Online (Sandbox Code Playgroud)

我的我Java environment有:

  JAVA_TOOL_OPTIONS     -Dfile.encoding=UTF8
Run Code Online (Sandbox Code Playgroud)

在我的Spring-controller:

@RequestMapping(value="sendMessage.html",method=RequestMethod.POST)
public  @ResponseBody String sendMessage(HttpSession session,@RequestParam String intxnId,@RequestParam String message, HttpServletRequest request,HttpServletResponse response){

        String contentType= "text/html;charset=UTF-8";
        response.setContentType(contentType);
        //response.setCharacterEncoding("UTF-8");
        response.setHeader("Content-Type", "application/json; charset=UTF-8");
        try {
            request.setCharacterEncoding("utf-8");

        } catch (UnsupportedEncodingException e) {
            e.printStackTrace();
        }
        response.setContentType("text/plain;charset=UTF-8"); 

        System.out.println("Send Message UTF-8 ----------------- "+ message);

    String json = null;
    BasicChatProtocol protocol = CustomerManagement.protocol.put(intxnId, chatProtocol.getProtocol());
    HashMap<String,String> result = send.send(message, intxnId, protocol);
    result.put("name",(String) session.getAttribute("nickName"));
    ObjectMapper map = new ObjectMapper();
    if(result.size()!= 0){
        try {
            json = map.writeValueAsString(result);
            result.clear();
            result = null;
            System.out.println("Send Message  :::::::: : "+json);
        } catch (Exception e) {
            e.printStackTrace();
        } 
    }
return json;

}
Run Code Online (Sandbox Code Playgroud)

我的jQuery-AJAX意志是:

function sendMessage(){
    var intxnId = $("#hide").val();
    var message = $("#message").val();
    alert("send  : \n intxnId : "+intxnId+"\nmessage : "+message);
    $.ajax({  
        type: "POST", 
        cache: false,
        url: contexPath + "/sendMessage.html",
        async:     true,
        contentType: "application/x-www-form-urlencoded; charset=utf-8",
        scriptCharset: "utf-8",
        dataType: 'html',
        data: "intxnId=" + intxnId +"&message="+ encodeURIComponent(message),

        success: function(response){

            if(response != null && response !="" && response !="null"){

                var txt = '{"data":['+response+']}';
                var json = eval ("(" + txt + ")");
                for(i =0;i<json.data.length;i++){
                    var data = json.data[i];

                    var name = data.name;
                    var message = data.message;
                    var time = data.time;

                    alert("Name : "+name+"\nMessage : "+message+"\ntime : "+time);
                    var createHTML  = send(name,message,time);
                    $("#messageDisplayArea").append(createcreateHTML);
                };
            }

        },  
        error: function(e){  
            alert('Error: ' + e);  
        }, 

    }); 
}
Run Code Online (Sandbox Code Playgroud)

但是,当我发送当地语言信息???????????(泰米尔语)时,我只得到???????了alert box和view page.

但我得到了local language控制台(SysOut in controller)和所有Special Characters工作.

注:我觉得我有这个问题response from the controller.因为当我发送message到controller我得到了message as small boxes在javascript alert.但是当response我来到时,我就?????进入了alert box.

我的控制台打印,

Send Message UTF-8 ----------------- ???????????
Mesge what I send :::: ???????????
Send Message :::::::: : {"message":"???????????","time":"time","name":"Human"}
Run Code Online (Sandbox Code Playgroud)

我不知道我错过了什么.

注意:我没有使用任何data base.

希望我们的堆栈用户能提供更好的解决方案.肯定赞赏好的答案.

Abe*_*tur 4

我已经用这个测试控制器尝试了你的javascript:

@Controller
public class TestController {
    @RequestMapping(value = "/test", method = POST, produces = "application/json; charset=utf-8")
    public @ResponseBody
    ResponseEntity<String> sendMessage(HttpSession session, @RequestParam String intxnId, @RequestParam String message, HttpServletRequest request, HttpServletResponse response) {

        System.out.println("Send Message UTF-8 ----------------- " + message);

        String json = null;
        HashMap<String, String> result = new HashMap<String, String>();
        result.put("name", "test");
        result.put("message", message);
        result.put("time", "time");
        ObjectMapper map = new ObjectMapper();
        if (!result.isEmpty()) {
            try {
                json = map.writeValueAsString(result);
                System.out.println("Send Message  :::::::: : " + json);
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
        HttpHeaders responseHeaders = new HttpHeaders(); 
        responseHeaders.add("Content-Type", "application/json; charset=utf-8"); 
        return new ResponseEntity<String>(json, responseHeaders, HttpStatus.CREATED);
    }
}
Run Code Online (Sandbox Code Playgroud)

它的工作原理就像一个魅力,我使用 Chrome 浏览器在警报弹出窗口中看到响应中的 UTF-8 字符。

我的测试.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%request.setCharacterEncoding("UTF-8");%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>
        <h1>Test</h1>
        <input type="text" id="hide" />
        <input type="text" id="message"/>
        <button id="button">test</button>
        <div id="messageDisplayArea"></div>


        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
        <script>
        $('#button').on('click', sendMessage);

        function sendMessage() {
            var intxnId = $("#hide").val();
            var message = $("#message").val();
            alert("send  : \n intxnId : " + intxnId + "\nmessage : " + message);
            $.ajax({
                type: "POST",
                cache: false,
                url: "${pageContext.request.contextPath}/test",
                async: true,
                data: "intxnId=" + intxnId + "&message=" + encodeURIComponent(message),
                success: function(response) {

                    if (response !== null && response !== "" && response !== "null") {
                        alert("Name : " + response.name + "\nMessage : " + response.message + "\ntime : " + response.time);
                        $("#messageDisplayArea").append(message);
                    }

                },
                error: function(e) {
                    alert('Error: ' + e);
                },
            });
        }
    </script>
    </body>

</html>
Run Code Online (Sandbox Code Playgroud)