網上搜索結合自己開發過程中遇到的情況,整理一下,以備忘:
AJax表單提交數據出現亂碼和解決辦法
//要傳遞的參數
var queryString = "firstName=" + firstName + "&lastName=" + lastName
+ "&birthday=" + birthday; function
在另一網友秋憶博客,找到了另一種方法,以下是原文的內容:
前段時間寫JSP,使用AJax以POST方式提交數據,如果是中文字符提交就會亂碼,後來寫ASP時用到AJax以POST方式提交數據,中文一樣是亂碼。搜索一下相關資料,問題應該是提交數據時是以UTF-8編碼提交,所以接收時如果使用GB2312或者其它中文編碼的話就會亂碼。
使用GET方式提交數據的時候,中文問題很好解決,setRequestHeader("Content-Type","text/Html; encoding=gb18030")就可以了。但這個方法在POST方式中卻不起作用。大家都知道GET方式提交數據有長度限制,有時我們必須使用 POST方式來提交數據。
對於使用POST,JSP的解決方法如下:
使用escape(或encodeURI,兩個函數都是JavaScript的函數,功能基本相同,可以查一下相關的幫助),但要使用兩次,這個是關鍵。
初始頁面內容如下(hello.JSP):
<%@ page language="java" import="Java.util.*" pageEncoding="GB18030"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD Html 4.01 Transitional//EN">
<Html>
<head>
<title>AJax提交頁面</title>
<meta http-equiv="Content-Type" content="text/Html; charset=GB18030">
<script type="text/Javascript">
function justdo(){
var post = "name=王力猛&email=wallimn@sohu.com&bokee=http://wallimn.bokee.com";
post = encodeURI(post);
post = encodeURI(post); //兩次,很關鍵
var xmlObj = new ActiveXObject("Msxml2.XMLHTTP");
var URL = "act.JSP"; //文件名需要調整成測試時的相應位置
XMLObj.open("POST",URL,true);
XMLObj.setRequestHeader("Cache-Control","no-cache");
XMLObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
XMLObj.send(post); //注意:POST方式,使用這個來發送內容
}
</script>
</head>
<body>
<input type="button" value="提交" />
</body>
</Html>
AJax請求處理頁面(act.JSP)的內容如下:
<%@ page language="java" import="Java.util.*" pageEncoding="GB18030"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD Html 4.01 Transitional//EN">
<%@page import="Java.Net.URLDecoder"%>
<Html>
<head>
<title>AJax deal</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
</head>
<body>
<%
//遍歷輸出參數內容。
for (Enumeration e = request.getParameterNames(); e.hasMoreElements();) {
String h = (String)e.nextElement();
String v = request.getParameter(h);
String mm = Java.Net.URLDecoder.decode(v, "UTF-8");
System.out.println("請求參數: " + h + " = " + mm);
}
%>
</body>
</Html>
分析:當調用request.getParameter()函數時,會自動進行一次URI的解碼過程,調用時內置的解碼過程會導致亂碼出現。而URI編碼兩次後,request.getParameter()函數得到的是原信息URI編碼一次的內容。再用可控的解碼函數 Java.Net.URLDecoder.decode()就可解出原始的正確的信息。
對於ASP,可以在客戶端使用Javascript的encodeURIComponent函數(其它編碼函數可能也行,沒有試)編碼兩次,然後ASP使用Request.Form接收後使用JavaScript的decodeURIComponent解碼一次:
初始頁面內容如下(hello.ASP):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD Html 4.01 Transitional//EN">
<Html>
<head>
<title>AJax提交頁面</title>
<meta http-equiv="Content-Type" content="text/Html; charset=GB2312">
<script type="text/Javascript">
function justdo(){
var post = "name=" + encodeURIComponent(encodeURIComponent("王力猛")); //兩次
var xmlObj = new ActiveXObject("Msxml2.XMLHTTP");
var URL = "act.ASP"; //文件名需要調整成測試時的相應位置
XMLObj.open("POST",URL,true);
XMLObj.setRequestHeader("Cache-Control","no-cache");
XMLObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
XMLObj.send(post); //注意:POST方式,使用這個來發送內容
}
</script>
</head>
<body>
<input type="button" value="提交" />
</body>
</Html>
AJax請求處理頁面(act.ASP)的內容如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD Html 4.01 Transitional//EN">
<Html>
<head>
<title>AJax deal</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
</head>
<body>
<%
Dim context
context = decodeText(Request.Form("name"))
Response.Write("name=" & context)
%>
</body>
</Html>
<script language="Javascript" runat="server">
function decodeText(str){
return (str == null ? "" : decodeURIComponent(str));
}
</script>