Home > Article > Web Front-end > JavaScript garbled code
For parameter encoding in
javascript:
JavaScript code is encoded once
1.url=encodeURI(url); //Note: The parameter of encodeURI() is the entire URL, including the request address and parameters
After the server side obtains the parameters Transcoding:
Java code Transcoding once
1.String linename = new String(request.getParameter("name").getBytes("ISO-8859-1"),"UTF-8");
Or:
JavaScript code Encoded twice
1.url=encodeURI(encodeURI(url)); // Used encodeURI 2 times
Server-side acquisition:
Java code Decoded once
1.String linename = request .getParameter(name);
2.//java : Character decoding
3.linename = java.net.URLDecoder.decode(linename, "UTF-8");
PS: When exchanging data between the front and backend, the final It is best to use JSONObject to encapsulate the data.
Test
Server: WebLogic10.x
Browser: IE9.0
Test 1:
Front-end JavaScript
//Ext.util.JSON.encode here is to convert a JSONObject into a JSON string, Different meaning from encodeURI
//fileUpload in caseEndReport is set to true
var caseEndReportTab = Ext.util.JSON.encode(caseEndReport.getForm().getValues(false));
caseEndReport.getForm().submit({
url:'payCaseManage.do?oper=saveCaseEndReport&caseEndReportTab='+caseEndReportTab,
Msg.alert('tip', "Information saved successfully!"); Function () {
EXT.MSG.Alert ('Tips', 'Information preservation fails, you have no operating permissions!');
}}}); Tab ") ; UTF-8");
request.setCharacterEncoding("UTF-8");
response.setContentType("application/x-json");
The above code will output no garbled characters.
If you add
response.setCharacterEncoding("UTF-8");//do not add request.setCharacterEncoding("UTF-8");
response.setContentType("application/x-json");
JSONObject caseEndReportJson = JSONObject.fromObject(caseEndReportTab);
to
JSONObject caseEndReportJson = JSONObject.fromObject(new String(caseEndReportTab.getBytes("ISO8859_1"),"UTF-8")) ;
The output is correct.
Front-end JavaScript
// fileUpload in queryForm is set to false, query is a JSON string, and contains Chinese
//Ext.util.JSON.encode just converts a JSONObject into a JSON string. Different meaning from encodeURI
var query = Ext.util.JSON.encode(queryForm.getForm().getValues(false));
caseStore.proxy = new Ext.data.HttpProxy({url:"payCaseManage.do?oper =listCase&query="+query});
Backend Java code
response.setCharacterEncoding("UTF-8");
response.setContentType("application/x-json ");
String query = request.getParameter("query");
//or String query = new String(request.getParameter("query").getBytes("ISO8859_1"),"UTF-8");
JSONObject queryObject = JSONObject.fromObject(query);
String county = queryObject.getString("county");
String city = queryObject.getString("city");
System.out.println(city+county);
Test 3:
Frontend JavaScript
//The frontend encodes the URL twice, and the query string contains Chinese content
var query = Ext.util.JSON.encode(queryForm.getForm().getValues(false));
var url = "payCaseManage.do?oper=listCase&query="+query;
var dataUrl = encodeURI(encodeURI(url));
caseStore.proxy = new Ext.data.HttpProxy({url:dataUrl});
// The background Java performs java.net.URLDecoder.decode on request.getParameter(" query ") once
response.setCharacterEncoding("UTF-8");
request.setCharacterEncoding("UTF-8");
response.setContentType(" application/x-json");
String query = java.net.URLDecoder.decode(request.getParameter("query"),"UTF-8");
JSONObject queryObject = JSONObject.fromObject(query);
String county = queryObject.getString("county");
String city = queryObject.getString("city");
System.out.println(city+county);
The result output is correct in Chinese
Test 4:
Front-end JavaScript
//EncodeURI twice for url, caseRootId contains Chinese content
caseTreeLoaderDataUrl = 'payCaseManage.do?oper=treeLoad&nodeId=' + node.id+'&text='+node.text+'&caseRootId='+caseRootId;
caseTree.loader. dataUrl = encodeURI(encodeURI(caseTreeLoaderDataUrl));
Background Java
response.setCharacterEncoding("UTF-8");
request.setCharacterEncoding("UTF-8");
response.setContentType("application/x-json") ;
//Perform java.net.URLDecoder.decode on request.getParameter("caseRootId") once
String caseRootId = java.net.URLDecoder.decode(request.getParameter("caseRootId"),"UTF-8");
System.out.println(caseRootId);
The result output is in Chinese correctly
Test 5:
Front-end JavaScript
//Do not encodeURI the URL. Both city and county contain Chinese content
var city = queryForm.getForm().findField("city").getValue();
var county = queryForm.getForm().findField("county").getValue();
caseStore.proxy = new Ext.data.HttpProxy({url:"payCaseManage.do?oper=listCase&city="+city+"&county="+county"});
Backend Java code
//Do not use java.net.URLDecoder .decode processes request.getParameter()
response.setCharacterEncoding("UTF-8");
request.setCharacterEncoding("UTF-8");
response.setContentType("application/x-json");
String county = request.getParameter("county");
String city = request.getParameter("city");
System.out.println(city+county);
Output Chinese garbled characters