`

js编码处理[转]

阅读更多

1.       使用 JS 中的 encodeURIComponent encodeURI 方法。

说明:

 

encodeURIComponent(String)

对传递参数进行设置。不编码字符有 71 个: ! ' ( ) * - . _ ~ 0-9 a-z A-Z

例:

var url = “<a href=’http://cancait.blog.163.com/name=” + encodeURIComponent(“ 中国 ”) + “’> 中国 </a>”;

 

encodeURI(String)

URL 整体转换。不编码字符有 82 个: ! # $ & ' ( ) * + ,,, - . / : ; = ? @ _ ~ 0-9 a-z A-Z

例:

var url = “<a href=’” + encodeURI(“http://cancait.blog.163.com/name= 中国 ”) + “’> 中国 </a>”;

 

乱码处理实例:

/////////////////////////////////////////////////////////////////////////////////////

初始页面内容如下 (hello.jsp)

/////////////////////////////////////////////////////////////////////////////////////
<%@ page language="java" import="java.util.*" pageEncoding="GB18030"%>
<%String path = request.getContextPath();%>
<!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 = '<%= path%>/page/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="
提交 " onclick="justdo()"/>
    </body>
</html>
/////////////////////////////////////////////////////////////////////////////////////
   ajax 请求处理页面( act.jsp )的内容如下 :
/////////////////////////////////////////////////////////////////////////////////////
<%@ page language="java" import="java.util.*" pageEncoding="GB18030"%>
<%String path = request.getContextPath();%>
<!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>
/////////////////////////////////////////////////////////////////////////////////////

 

说明:

java.net.URLencode java.net.URLDecode 分别对应于 JavaScript 中的 encodeURI decodeURI encodeURIComponent decodeURIComponent.

 

为什么要连续两次调用 encodeURI(String) 方法呢?是因为 Java 中的 request.getParameter(String) 方法会进行一次 URI 的解码过程,调用时内置的解码过程会导致乱码出现。而 URI 编码两次后, request.getParameter(String) 函数得到的是原信息 URI 编码一次的内容。接着用 java.net.URLDecoder.decode(String str,String codename) 方法,将已经编码的 URI 转换成原文。

2.       使用 JS 中的 escape 方法。

说明:

escape(String)

0-255 以外的 unicode 值进行编码时输出 %u**** 格式,其它情况下 escape encodeURI encodeURIComponent 编码结果相同。

例:

var url = “<a href=’http://cancait.blog.163.com/name=” + escape (“ 中国 ”) + “’> 中国 </a>”;

 

乱码处理实例:

/////////////////////////////////////////////////////////////////////////////////////

例子跟上面一样。只有这里不同。

(hello.jsp)

post = escape(post);
   post = escape (post);//
两次,很关键

       

(act.jsp)

String h = (String) e.nextElement();
    String v = request.getParameter(h);
String mm =   EscapeUnescape .unescape( v
"UTF-8");
    System.out.println("
请求参数 : " + h + " = " + mm);


/////////////////////////////////////////////////////////////////////////////////////

(EscapeUnescape .java)Java 中的 escape unescape. 内容如下:

/////////////////////////////////////////////////////////////////////////////////////

package cn.kgnews.util;

 

public class EscapeUnescape {

public static String escape(String src) {

int i;

char j;

StringBuffer tmp = new StringBuffer();

tmp.ensureCapacity(src.length() * 6);

 

for (i = 0; i < src.length(); i++) {

 

        j = src.charAt(i);

       

        if (Character.isDigit(j) || Character.isLowerCase(j)

                || Character.isUpperCase(j))

        tmp.append(j);

        else if (j < 256) {

        tmp.append("%");

                if (j < 16)

                tmp.append("0");

        tmp.append(Integer.toString(j 16));

        } else {

        tmp.append("%u");

        tmp.append(Integer.toString(j 16));

        }

        }

return tmp.toString();

}

 

public static String unescape(String src) {

StringBuffer tmp = new StringBuffer();

tmp.ensureCapacity(src.length());

int lastPos = 0 pos = 0;

char ch;

while (lastPos < src.length()) {

        pos = src.indexOf("%" lastPos);

        if (pos == lastPos) {

                if (src.charAt(pos + 1) == 'u') {

                ch = (char) Integer.parseInt(src

                        .substring(pos + 2 pos + 6) 16);

                tmp.append(ch);

                lastPos = pos + 6;

                } else {

                ch = (char) Integer.parseInt(src

                        .substring(pos + 1 pos + 3) 16);

                tmp.append(ch);

                lastPos = pos + 3;

                }

        } else {

                if (pos == -1) {

                tmp.append(src.substring(lastPos));

                lastPos = src.length();

                } else {

                tmp.append(src.substring(lastPos pos));

                lastPos = pos;

                }

        }

        }

return tmp.toString();

}

}

 

/////////////////////////////////////////////////////////////////////////////////////

说明:

EscapeUnescape .java 类是 Java 中的 escape unescape

原理跟上例一样。

 

3.       JavaScript 实现 java 中的 URLencode URLdecode.

说明:

这种方法服务器端代码不必修改。直接 request.getParameter() 来获取就可以了。

 

JavaScript 中的 URLencode URLdecode 实现如下:

 

/////////////////////////////////////////////////////////////////////////////////////

(UrlEncodeUrlDecode_gecko.js) IE 实现方法如下:

完整代码可到这里下载:

http://www.blueidea.com/user/qswh/qswhU2GB.js

/////////////////////////////////////////////////////////////////////////////////////

var qswhU2GB = […..]; // 此数组为 GB Unicode 对照表

 

function UrlEncode(str){

var i c ret="" strSpecial="!\"#$%&'()*+ /:;<=>?@[\]^`{|}~%";

for(i=0;i<str.length;i++){

if(str.charCodeAt(i)>=0x4e00){

        c=qswhU2GB[str.charCodeAt(i)-0x4e00];

        ret+="%"+c.slice(0 2)+"%"+c.slice(-2);

        }

else{

        c=str.charAt(i);

        if(c==" ")

        ret+="+";

        else if(strSpecial.indexOf(c)!=-1)

        ret+="%"+str.charCodeAt(i).toString(16);

        else

        ret+=c;

        }

}

return ret;

}

function UrlDecode(str){

var i c d t p ret = "";

function findPos(str){

for(var j = 0; j < qswhU2GB.length; j++){

        if(qswhU2GB[j] == str){

        return j;

        }

        }

return -1;

}

 

for(i = 0;i < str.length;){

        c = str.charAt(i);i++;

if(c != "%"){

        if(c == "+"){

        ret += " ";

        }else{

        ret += c;

        }

}else{

        t = str.substring(i i+2);i += 2;

        if(("0x" + t) > 0xA0){

                d = str.substring(i+1 i+3);i += 3;

                p = findPos(t + d);

        if(p != -1){

                ret += String.fromCharCode(p + 0x4e00);

                }

        }else{

        ret += String.fromCharCode("0x" + t);

        }

        }

}

return ret;

}

 

function getSpell(str sp){

var i c t ret="";

if(sp==null)sp="";

for(i=0;i<str.length;i++){

if(str.charCodeAt(i)>=0x4e00){

        c=parseInt(qswhU2GB[str.charCodeAt(i)-0x4e00] 16);

        if(c<55290){

        for(t=qswhSpell.length-1;t>0;t=t-2)if(qswhSpell[t]<=c)break;

        if(t>0)ret+=qswhSpell[t-1]+sp;

        }

        }

}

return ret.substr(0 ret.length-sp.length);

}

 

/////////////////////////////////////////////////////////////////////////////////////

(UrlEncodeUrlDecode_ie.js)IE 实现方法如下:

/////////////////////////////////////////////////////////////////////////////////////

function UrlEncode(str) {

var ret = "";

var strSpecial = " ~!\"#$%&'()*+- /:;<=>?[]^`{|}~%";

for (var i = 0; i < str.length; i++) {

var chr = str.charAt(i);

strstr = chr;

execScript("c = hex(asc(strstr))" "VBScript");

        if (parseInt("0x" + c) > 127) {

        ret += "%" + c.slice(0 2) + "%" + c.slice(-2);

        } else {

        if (strSpecial.indexOf(chr) != -1) {

        ret += "%" + c.toString(16);

        } else {

        ret += chr;

        }

        }

}

return ret;

}

function UrlDecode(str) {

var ret = "";

for (var i = 0; i < str.length; i++) {

var chr = str.charAt(i);

        if (chr == "+") {

        ret += " ";

        } else {

        if (chr == "%") {

        var asc = str.substring(i + 1 i + 3);

                if (parseInt("0x" + asc) > 127) {

                temp = parseInt("0x" + asc + str.substring(i + 4 i + 6));

                execScript("rt = chr(temp)" "VBScript");

                ret += rt;

                i += 5;

                } else {

                temp = parseInt("0x" + asc);

                execScript("ret = ret + chr(temp)" "VBScript");

                i += 2;

                }

        } else {

        ret += chr;

        }

        }

}

return ret;

}

 

/////////////////////////////////////////////////////////////////////////////////////

(loadcssorjs.js) 自动识别浏览器动态导入 JS/CSS

实现方法如下:

/////////////////////////////////////////////////////////////////////////////////////

/*

CopyRight(C)CAnca Software Office.

Created by CAnca.2007.9.4

*/

 

function LoadScript(url) {

document.write("<scr" + "ipt type=\"text/javascript\" src=\"" + url + "\" onerror=\"alert('Error loading ' + this.src);\"></scr" + "ipt>");

}

function LoadCss(url) {

document.write("<link href=\"" + url + "\" type=\"text/css\" rel=\"stylesheet\" onerror=\"alert('Error loading ' + this.src);\" />");

}

 

 

var sSuffix = /msie/.test(navigator.userAgent.toLowerCase()) ? "ie" : "gecko";

LoadScript("js/UrlEncodeUrlDecode_" + sSuffix + ".js");

 

使用方法:

将三个 JS 文件放在同目录。在页面导入 loadcssorjs.js 。在要进行编码的地方使用 UrlEncode 方法即可。

例:

//index.html

<html>

<head>

<script language=”javascript” src=”js/loadcssorjs.js”></script>

<script language=”javascript”>

        var url = “ http://cancait.blog.163.com/name= ” + UrlEncode (“ 中国人 ”);

        window.open(url);

</script>

</head>

<body>

…..

</body>

</html>

 

三种解决方案的比较:

 

第一种, 在服务器端需要一次 java.net.URLdecode(String) 转码。使用起来,不太方便。

第二种, 要建立 Java 版的 escape uncape 。在服务器端还是需要一次 uncape 转码。使用起来,不太方便。

第三种, 是最方便的一种方法。只需要客户端进行编码。服务器端可以不做任何修改。唯一缺点的是: firefox 浏览网页时,要加载一个 150K UrlEncodeUrlDecode_gecko.js 文件。影响了浏览速度。(但本人还是推荐使用这方案。)

 

总结:

当然, Ajax 实现不乱码,可以不用这三种方案,用这三种方案,只是迫不得已的做法。通常造成乱码的原因有以下几点:

1. xmlhttp  返回的数据默认的字符编码是 utf-8 ,如果前台页面是 gb2312 或者其它编码数据就会产生乱码。

2. post 方法提交数据默认的字符编码是 utf-8 ,如果后台是 gb2312 或其他编码数据就会产生乱码。

 

解决方法:

 

­ 推荐方法:由于 Javascript 沿用 java 的字符处理方式,内部是使用 unicode 来处理所有字符的。 前台后台都用 utf-8 编码,这样可以省不少麻烦,从根本上解决了乱码问题 . 优点是效率高,而且符合目前的形式, utf-8 编码本身就是一种比较优秀的编码,没有语言限制 . 缺点只能调用自己的后台编码或者其他的 utf-8 的编码。

 

前台更改为

 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 

后台 asp 中第一行加入如下代码

分享到:
评论

相关推荐

    JS实现URL编码转换中文

    ### JS实现URL编码转换中文 在Web开发过程中,经常需要处理URL中的特殊字符,特别是中文字符。由于URL传输限制及浏览器解析原因,中文等非ASCII字符需要被编码为特定格式才能在网络上传输。本文将详细介绍如何使用...

    易语言JS实现编码转换源码

    JavaScript是一种广泛应用于Web开发的脚本语言,它在处理字符串编码时扮演着重要角色,尤其是在处理不同字符集和编码格式之间转换时。 编码转换是编程中常见且重要的任务,尤其在网络通信和数据存储中。JavaScript...

    易语言源码易语言JS实现编码转换源码.rar

    3. **JavaScript编码处理**:JavaScript中可以使用`Buffer`对象和`TextDecoder`、`TextEncoder` API进行编码转换。例如,`Buffer`对象用于处理二进制数据,而`TextDecoder`和`TextEncoder`则负责将二进制数据解码成...

    Node.js-iconv-lite-纯javascript转换字符编码

    在处理文本时,尤其是涉及不同编码格式的数据,Node.js 提供了丰富的库来支持,其中 `iconv-lite` 就是一个非常重要的角色。 `iconv-lite` 是一个纯 JavaScript 实现的字符编码转换库,它不需要任何 C++ 扩展,因此...

    JS实现编码转换.rar

    综上所述,JS实现编码转换涉及到了JavaScript的字符串处理、Unicode编码以及可能的第三方库使用。在实际项目中,要充分理解各种编码标准,熟练掌握相关的API和工具,以便在多语言环境下保证数据的正确传输和显示。...

    js的encodeUri编码转换为GBK问题

    `GBKUrl.js`这个文件很可能是用来处理GBK编码到URI编码转换的工具脚本。这个脚本可能包含以下功能: 1. 使用`TextDecoder`来解码GBK编码的字符串: ```javascript const decoder = new TextDecoder('GBK'); ...

    js技巧 javaScript编码技巧

    本文将深入探讨一些JS编码技巧,帮助开发者提升网站特效的实现能力。 一、变量与数据类型 在JavaScript中,变量声明通常使用`var`、`let`或`const`关键字。理解其作用域和生命周期至关重要。`var`具有函数作用域,...

    javascript处理中文base64编码

    由于遇到做一个支付平台的接口参数要做base64 于是就写了一个用javascript编写的方法,对方支付平台是java的 ,于就将中文做了一个unicode转为assi码处理。

    js对中文字符串进行gb2312编码解码

    在JavaScript(JS)中,处理中文字符编码是一个常见的需求,特别是在与服务器交互或者处理文本数据时。GB2312编码是一种在中国大陆广泛使用的简体中文字符集,它包含了6763个常用汉字和一些其他字符。在JavaScript中...

    易语言JS实现编码转换源码.7z

    当你看到“易语言JS实现编码转换源码”时,可以理解为这是一个使用易语言编写的程序,该程序的功能是处理JavaScript中的字符编码转换问题。 在编程中,编码转换是一个非常关键的环节,尤其是在处理多国语言或者跨...

    js实现GBK编码

    当我们在JS中处理含有GBK编码的字符串时,我们需要将其转换为可以在URL中安全传递的形式,因为URL不支持非ASCII字符。这通常涉及到两个步骤: 1. **GBK编码转换**:将包含GBK字符的字符串转换成字节序列。在JS中,...

    JavaScript中文转拼音,JS中文转拼音插件,中文转拼音(JavaScript)

    1. **字符编码处理**:首先,需要将中文字符转换为Unicode编码,因为JavaScript原生支持Unicode字符处理。 2. **拼音数据库**:使用预定义的拼音数据库,这个数据库包含所有中文字符及其对应的拼音。当遇到一个中文...

    中文转换成十六进制编码

    十六进制编码是一种将字符转换为数字表示的方法,尤其在处理非ASCII字符集(如中文)时非常有用。本文将详细介绍如何将中文字符转换成十六进制编码,并通过一个简单的步骤进行演示。 中文字符集主要有GB2312、GBK、...

    javascript 判断是否GBK编码

    在JavaScript中,判断一个字符串是否属于GBK编码是一个常见的需求,特别是在处理中文字符集时。GBK是GB2312的扩展,包含了更多的汉字和其他字符,是Windows系统中广泛使用的中文编码标准。本篇将深入探讨如何通过...

    js2c#-js转换c#代码

    JavaScript(简称JS)是一种广泛用于前端开发的轻量级脚本语言,而C#则是一种面向对象的编程语言,常用于构建Windows桌面应用、游戏、服务端应用等。"js2c#"工具正是一个旨在帮助开发者将JavaScript代码转换为C#代码...

    javascript转码GBK(u2gb.js)

    总的来说,`u2gb.js`是一个实用的JavaScript工具,它简化了Unicode到GBK编码的转换过程,使得开发者在处理中文字符编码问题时更加便捷。在实际开发中,理解字符编码的原理以及如何在JavaScript中进行转换是非常重要...

    使用javascript将汉字转化成UNICODE编码

    在JavaScript中,...总结,通过JavaScript,我们可以方便地实现汉字与Unicode编码之间的转换,这在处理多语言文本和特殊字符时尤其重要。了解并熟练运用这些技巧,对于提升JavaScript编程的效率和灵活性大有裨益。

    利用JS把URL地址栏%20、%55之类编码转成中文字符

    本文将深入探讨如何使用JavaScript(简称JS)来解码这些URL编码,使其转换回原本的中文或其他非英文字符。 ### URL编码与解码原理 URL编码的主要目的是确保URL中的所有字符都能在网络上传输,避免因特殊字符导致的...

    批量转换网页文件编码工具

    网页文件编码转换是一个重要的IT领域话题,特别是在处理多种语言或者跨平台内容时。批量转换网页文件编码工具就是为了解决这一问题而设计的。这类工具能够有效地帮助用户将大量HTML、CSS、JavaScript或其他类型的...

Global site tag (gtag.js) - Google Analytics