在进行JS开发过程中,尤其是在开发报表时,报表已集成到Web页面中,通过在页面传递参数至报表中时,会发现有时某些参数值,传递到报表中是显示为问号或乱码等等一系列不能正常显示的情况。

这是由于浏览器和报表服务器的编码不同,字符多次进行编码转换时出现错误导致字符的显示出现乱码,尤其是中日韩文和特殊字符更容易出现乱码问题。

以开发报表软件FineReport为例,在给报表服务器发送请求之前,对URL或者只对URL里面的参数名字和参数值,进行cjkEncode的编码,该方式兼容了各种不同的字符集,如ISO8859-1、 UTF-8、 GBK、 ENU_JP,尤其对中日韩文的处理采取了统一的方案。

javascript中FineReport字符转换原理

在给报表服务器发送请求之前,对URL或者只对URL里面的参数名字和参数值,进行cjkEncode的编码。源码如下:

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

<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.cpt¶name="+FR.cjkEncode("华东");

2、对Form表单进行cjkEncode

<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,完整代码如下:

<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>  

关于JS的编码转换问题的更多相关文章

  1. js 字符串编码转换函数

    escape 方法 对 String 对象编码以便它们能在所有计算机上可读, escape(charString) 必选项 charstring 参数是要编码的任意 String 对象或文字. 说明 ...

  2. [NodeJS] Node.js 编码转换

    Node.js 自带的 toString() 方法不支持 gbk,因此中文转换的时候需要加载第三方库,推荐以下两个编码转换库,iconv-lite 和 encoding. iconv, iconv-l ...

  3. Node.js 编码转换

    Node.js自带的toString()方法不支持gbk,因此中文转换的时候需要加载第三方库,推荐以下两个编码转换库,iconv-lite和encoding.       iconv, iconv-l ...

  4. PHP 支持中文目录和文件的的遍历:文件编码转换

    在使用 readdir() 遍历指定目录时,使中文目录和文件名都正常显示需要使用 iconv() 进行文件编码转换: <?php header("Content-type:text/h ...

  5. JS 字符串编码函数(解决URL特殊字符传递问题):escape()、encodeURI()、encodeURIComponent()区别详解

    javaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod ...

  6. js 中编码(encode)和解码(decode)的三种方法

    js对文字进行编码涉及3个函数:escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decodeURIComponent 下 ...

  7. android TextView Unicde编码转换 android中一些特殊字符Unicode码值

    android TextView Unicde编码转换 android中一些特殊字符Unicode码值 android中一些特殊字符(如:←↑→↓等箭头符号,约等于号≍)的Unicode码值 Text ...

  8. 详细介绍Base64的编码转换方式

    下面,详细介绍Base64的编码转换方式. 所谓Base64,就是说选出64个字符----小写字母a-z.大写字母A-Z.数字0-9.符号"+"."/"(再加上 ...

  9. 使用vbs脚本进行批量编码转换

    使用vbs脚本进行批量编码转换 最近需要使用SourceInsight查看分析在Linux系统下开发的项目代码,我们知道Linux系统中文本文件默认编码格式是UTF-8,而Windows中文系统中的默 ...

随机推荐

  1. Model验证功能

    占位符  {0}对应属性  {1}对应minimum  {2}对应maximum   [StringLength(15, MinimumLength = 6, ErrorMessage = " ...

  2. Python 3.4 Library setup

    matplotlib:  https://pypi.python.org/pypi/matplotlib/1.4.3 Unofficial Windows Binaries for Python Ex ...

  3. 深入.NET和C#的小型汽车租赁系统的框架

    前言:写这个小型系统之前呢,我们应该要猜测可能要用到哪些知识点. 那么对于这个小型系统:主要用到了如下的知识:  封装,集合(ArrayList和HashTable)和泛型和非泛型集合(泛型:List ...

  4. [Cordova] Plugin里使用iOS Framework

    [Cordova] Plugin里使用iOS Framework 前言 开发Cordova Plugin的时候,在Native Code里使用第三方Library,除了可以加速项目的时程.也避免了重复 ...

  5. css中的各种单位简述以及ios10下safari禁止缩放的问题

    px:绝对单位,页面按精确像素展示 em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值. rem:相对 ...

  6. jQueryMobile示例页面代码

    这是一个jQueryMobile示例页面 示例效果:http://hovertree.com/texiao/jquerymobile/ 可以在手机或者触屏浏览器查看效果. 以下是HTML代码: < ...

  7. JavaScript toUpperCase() 方法和 toLowerCase() 方法

    1,toUpperCase() 方法用于把字符串转换为大写. 一个新的字符串,在其中 stringObject 的所有小写字符全部被转换为了大写字符. 语法为: stringObject.toUppe ...

  8. 关于arcgis engine的注记显示与关闭问题

    1.注记的添加需要拿到IGeoFeatureLayer接口下的AnnotationProperties属性,转为IAnnotationLayerPropertiesCollection接口,并创建一个 ...

  9. iOS--浅谈iOS沙盒目录

    原文地址:http://blog.csdn.net/wzzvictory/article/details/18269713 出于安全考虑,iOS系统的沙盒机制规定每个应用都只能访问当前沙盒目录下面的文 ...

  10. 【原+转】创建CocoaPods私有podspec

    在我的上一篇文章<iOS 手把手教你发布代码到CocoaPods>中着重介绍如何将自己的代码索引添加到公开的CocoaPods中,当你需要主动地向大众开源你的代码时需要那么做.但在现实中我 ...