在进行JS开发过程中,尤其是在开发报表时,报表已集成到Web页面中,通过在页面传递参数至报表中时,会发现有时某些参数值,传递到报表中是显示为问号或乱码等等一系列不能正常显示的情况。
这是由于浏览器和报表服务器的编码不同,字符多次进行编码转换时出现错误导致字符的显示出现乱码,尤其是中日韩文和特殊字符更容易出现乱码问题。
以开发报表软件FineReport为例,在给报表服务器发送请求之前,对URL或者只对URL里面的参数名字和参数值,进行cjkEncode的编码,该方式兼容了各种不同的字符集,如ISO8859-1、 UTF-8、 GBK、 ENU_JP,尤其对中日韩文的处理采取了统一的方案。
javascript中FineReport字符转换原理
在给报表服务器发送请求之前,对URL或者只对URL里面的参数名字和参数值,进行cjkEncode的编码。源码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
function cjkEncode(text) {
if (text == null ) {
return "" ;
}
var newText = "" ;
for ( var i = 0; i < text.length; i++) {
var code = text.charCodeAt (i);
if (code >= 128 || code == 91 || code == 93) { //91 is "[", 93 is "]".
newText += "[" + code.toString(16) + "]" ;
} else {
newText += text.charAt(i);
}
}
return newText;
} |
经过编码的URL或者Form表单,报表服务器智能的将这些字符正确的转换过来。
cjkEncode方法在FineReport的JS库中已经预先提供了,用户只要加载了FR的JS库,就可以使用FR.cjkEncode对中日韩文字符进行encode,如下示例:
1、 对URL进行cjkEncode
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<html> <head> <meta http-equiv= "Content-Type" content= "text/html; charset=GBK" >
<script type= "text/javascript" src= "ReportServer?op=emb&resource=finereport.js" ></script>
<Script Language= "JavaScript" >
function frOpen() {
window.location=FR.cjkEncode( "http://localhost:8075/WebReport/ReportServer?reportlet=doc/Primary/Parameter/Parameter.cpt&地区=华东" );
} </Script> </head> <body> <input type= "button" value= "字符转换1" onclick= "frOpen()" >
</body> </html> |
如果只对参数值进行编辑转换,在参数后面调用FR.cjkEncode()方法,如:
window.location="http://localhost:8075/WebReport/ReportServer?reportlet=reportname.cptname="+FR.cjkEncode("华东");
2、对Form表单进行cjkEncode
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<html> <head> <meta http-equiv= "Content-Type" content= "text/html; charset=GBK" />
<script type= "text/javascript" src= "/WebReport/ReportServer?op=emb&resource=finereport.js" ></script>
<script> function autoSubmit() {
var Region1 = document.getElementById( 'Region' ); //获取到参数Region所在文本框
Region1.value = FR.cjkEncode(Region.value); //对值参数值进行编码转化
Region1.name = FR.cjkEncode( "地区" ); //对参数控件名编码转换,如果参数名字为英文,则不需要此操作
document.FRform.submit();
} </script> <body> <form name=FRform method=post action= "/WebReport/ReportServer?reportlet=doc/Primary/Parameter/Parameter.cpt" >
<input type= "text" id= "Region" name= "地区" value= "华东" >
<input type= "button" name= "show" value= "查看" onclick= "autoSubmit()" />
</body> </html> |
3、特殊符号处理
如果在需要进行cjkEncode的URI的参数中包含特殊字符,比如%,#,$,=,&,/,?,+,@等字符时,需要在cjkEncode之后,再次调用javascript的encodeURIComponent对这些特殊字符进行编码。如参数值是”%华%“这样的字符,就需要写成encodeURIComponent(FR.cjkEncode("%华%")),一定要先进行cjkEncode,然后再进行encodeURIComponent,完整代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<html> <head> <meta http-equiv= "Content-Type" content= "text/html; charset=GBK" >
<script type= "text/javascript" src= "ReportServer?op=emb&resource=finereport.js" ></script>
<Script Language= "JavaScript" >
function frOpen() {
window.location=FR.cjkEncode( "http://localhost:8075/WebReport/ReportServer?reportlet=doc/Primary/Parameter/Parameter.cpt&地区=" ) +encodeURIComponent(FR.cjkEncode( "%华%" ));
}
</Script> </head> <body> <input type= "button" value= "字符转换1" onclick= "frOpen()" >
</body> </html> |