JAVASCRIPT中URL 传递参数(特殊字符)解决方法及转码解码的介绍

有些符号在URL中是不能直接传递的,如果要在URL中传递这些特殊符号,那么就要使用他们的编码了。下表中列出了一些URL特殊符号及编码


    十六进制值 
1. + URL 中+号表示空格 %2B 
2. 空格 URL中的空格可以用+号或者编码 %20 
3. / 分隔目录和子目录 %2F 
4. ? 分隔实际的 URL 和参数 %3F 
5. % 指定特殊字符 %25 
6. # 表示书签 %23 
7. & URL 中指定的参数间的分隔符 %26 
8. = URL 中指定参数的值 %3D

解决的方法:

replace() 方法如果直接用str.replace("-","!") 只会替换第一个匹配的字符. 
而str.replace(/\-/g,"!")则可以替换掉全部匹配的字符(g为全局标志)。 
replace()

js中替换字符变量如下:

data2=data2.replace(/\%/g,"%25"); 
data2=data2.replace(/\#/g,"%23"); 
data2=data2.replace(/\&/g,"%26");

在使用url进行参数传递时,经常会传递一些 中文名(或含有特殊字符)的参数或URL地址,在后台处理时会发生转换错误。在有些传递页面使用GB2312,而在接收页面使用UTF8,这样接收到的参 数就可能会与原来发生不一致。使用服务器端的urlEncode函数编码的URL,与使用客户端java的encodeURI函数编码的URL,结果就不 一样。

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

java中的编码方法: 
escape() 方法:采用ISO Latin字符集对指定的字符串进行编码。所有的空格符、标点符号、特殊字符以及其他非ASCII字符都将被转化成%xx格式的字符编码(xx等于该字符 在字符集表里面的编码的16进制数字)。比如,空格符对应的编码是%20。unescape方法与此相反。不会被此方法编码的字符: @ * / + 
encodeURI()方法:把URI字符串采用UTF-8编码格式转化成escape格式的字符串。不会被此方法编码的字符:! @ # $& * ( ) = : / ; ? + ' 
encodeURIComponent ()方法:把URI字符串采用UTF-8编码格式转化成escape格式的字符串。与encodeURI()相比,这个方法将对更多的字符进行编码,比如 / 等字符。所以如果字符串里面包含了URI的几个部分的话,不能用这个方法来进行编码,否则 / 字符被编码之后URL将显示错误。不会被此方法编码的字符:! * ( ) 
因 此,对于中文字符串来说,如果不希望把字符串编码格式转化成UTF-8格式的(比如原页面和目标页面的charset是一致的时候),只需要使用 escape。如果你的页面是GB2312或者其他的编码,而接受参数的页面是UTF-8编码的,就要采用encodeURI或者 encodeURIComponent。

另外,encodeURI/encodeURIComponent是在java1.5之后引进的,escape则在java1.0版本就有。 
1、  传递参数时需要使用encodeURIComponent,这样组合的url才不会被#等特殊字符截断。 
   例如:

Html代码 
  1. < languagelanguage="java">write('<a href="http://passport.baidu.com/?logout&aid=7&u='+encodeURIComponent("http://cang.baidu.com/bruce42")+'">退出</a>');</>


2、  进行url跳转时可以整体使用encodeURI 
例如:

Java代码 
  1. Location.href=encodeURI("http://cang.baidu.com/do/s?word=百度&ct=21");


3、  js使用数据时可以使用escape 
例如:搜藏中history纪录。 
4、  escape对0-255以外的unicode值进行编码时输出%u****格式,其它情况下escape,encodeURI,encodeURIComponent编码结果相同。 
最多使用的应为encodeURIComponent,它是将中文、韩文等特殊字符转换成utf-8格式的url编码,所以如果给后台传递参数需要使用encodeURIComponent时需要后台解码对utf-8支持(form中的编码方式和当前页面编码方式相同) 
escape不编码字符有69个:*,+,-,.,/,@,_,0-9,a-z,A-Z 
encodeURI不编码字符有82个:!,#,$,&,',(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z 
encodeURIComponent不编码字符有71个:!, ',(,),*,-,.,_,~,0-9,a-z,A-Z 
以下是url中可能用到的特殊字符及在url中的经过编码后的值: 
字符

特殊字符的含义

URL编码 

符号 解释 转义
# 用来标志特定的文档位置 %23
% 对特殊字符进行编码 %25
& 分隔不同的变量值对 %26
+ 在变量值中表示空格 %2B
/ 表示目录路径 %2F
\ 表示目录路径 %5C
= 用来连接键和值 %3D
? 表示查询字符串的开始 %3F
空格 空格 %20
. 句号 %2E
: 冒号 %3A

项目中发现,直接对url中的参数部分做encodeURI()编码转换,后台servlet通过getParamater()获取时,不需要转换可以直接获取到正确的值。

 
附录:

javascript中可用的编码解码函数,有如下的组合:

  • escape(string); 
    unescape(string);
  • encodeURI(string); 
    decodeURI(string);
  • encodeURIComponent(string); 
    decodeURIComponent(string);

他们之间的区别为:

escape/unescape: 
以16进制编码字符串,对空格、符号等字符用%xx编码表示,对中文等字符用%uxxxx编码表示。自javascript1.5之后,此方法已经不被推荐使用。

encodeURI/decodeURI: 
以UTF-8编码编码字符串,对这些字符:“ ; , / ? : @ & = + $ ”不做编码。

encodeURIComponent/decodeURIComponent: 
以UTF-8编码编码所有字符串。

因为escape/unescape已经deprecated。就不说它了,encodeURI和encodeURIComponent之前的区别用实例说明:

比如说要使用get方式将一个参数u,传递给服务器:

var  u="index.php?blogId=1&op=Default"; 
var  getURL="http://www.simplelife.cn/test.php?p="+encodeURI(u);

这里,如果使用了encodeURI,那么最终的getURL的值为:

http://www.simplelife.cn/test.php?p=index.php?blogId=1&op=Default

这样,对参数u中的字符"&op=Default",将不会作为字符串参数传递到服务器端,而是当作test.php的参数传递过去了,因为对"&op=Default"中的字符"&"没有做编码。 
所以,在这种应用场景下,就需要使用encodeURIComponent,编码后的getURL值为:

http://www.simplelife.cn/test.php?p=index.php%3FblogId%3D1%26op%3DDefault

这样,参数就可以顺利传递过去了。在服务器端得到的字符串将是正确的u。

反之,如果需要通过get方式访问某一URL,但是URL中包含中文等字符,为了防止乱码等编码问题,需要将URL通过encodeURI进行编码。

 

前端url传递编码问题的更多相关文章

  1. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  2. web前端url传递值 js加密解密

    一:Js的Url中传递中文参数乱码问题,重点:encodeURI编码,decodeURI解码: 1.传参页面Javascript代码: <script type=”text/javascript ...

  3. URL传递的参数是UTF-8编码,在打开的页面正常显示(GB2312)的方法

    URL传递的参数采用的是UTF-8编码,在打开的子页面中显示乱码, URL传递的地址形如:http://localhost/test.aspx?orgname=%E5%8B%**%**%**%**&a ...

  4. 前端为什么要对url进行编码

    为什么要对url进行编码 url有规范,在参数值中出现&字符会截断参数 url中文的问题,编码客转换为英文 也是第一种情况,url中有个参数值是url,传输的时候会出现错误 例1 有这样一串参 ...

  5. encodeURI来解决URL传递时的中文问题

    在AJAX浏览器来进行发送数据时,一般它所默认的都是UTF-8的编码. 使用JQUERY中所提供的方法来做操作 encodeURI function verify() {    //解决中文乱麻问题的 ...

  6. .NET在IE9中页面间URL传递中文变成乱码的解决办法

     在.Net的项目中,鼠标点击查询按钮,转到查询页面,但URL中包含中文时,传到服务器端后,中文变成了乱码(只有IE9出现该问题).       尝试使用Server.UrlEncode()进行编码, ...

  7. 关于JAVA中URL传递中文参数的问题

    今天在调用一个接口时,需要传递一个中文参数,结果获取不到数据,原因就在于中文传参的编码问题. 问题来源:URL url= new URL("http://XXX?OrganName=司法厅& ...

  8. Java中url传递中文参数取值乱码的解决方法

    java中URL参数中有中文值,传到服务端,在用request.getParameter()方法,得到的常常会是乱码,这将涉及到字符解码操作. 方法一: http://xxx.do?ptname=’我 ...

  9. url传递中文的解决方案

    本文转载:http://www.cnblogs.com/ghd258/archive/2005/10/23/260241.html url传递中文的解决方案 1.设置web.config文件. < ...

随机推荐

  1. 设置eclipse编码格式

    1.修改eclipse默认工作空间编码方式.点击Window-->Preferences-->General-->Workspace,设置编码格式为UTF-8,然后点击OK.

  2. rowspan && colspan

    > 跨行 <html> <body> <table width="> <tr> <th>col1</th> &l ...

  3. 老话题之C#写邮件发送

    唉!近来特么QQ邮件也犯二,突然间以前写的代码邮件发不出去,各种报错,无奈之下,换成了@163.com,可是报错依然,该开通(POP3/SMTP/IMAP)的都开通了!我勒了个草,像是在玩哥一样,还好 ...

  4. iframe自适应高度(兼容多种浏览器)

    http://jingyan.baidu.com/article/b87fe19eaeb2cf5218356896.html 让iframe自适应高度,下面是实现的源码: <div id=&qu ...

  5. VMware 共享目录不显示的解决办法

    centos mount -t vmhgfs .host:/ /mnt/hgfs # 如果有如下提示: # Error: cannot mount filesystem: No such device ...

  6. 1_archlinux_安装篇

    系统安装 可参考网友的文章: https://www.douban.com/note/263375303/?type=like http://www.68idc.cn/help/server/linu ...

  7. myEclipse项目转成Eclipse项目

    这里说一种把myEclipse项目转成Eclipse项目继续开发 1.  请首先确保你的eclipse是javaee版本的,或者已经安装看wtp插件 2.  然后修改eclipse工程下的.proje ...

  8. [BZOJ4003]城池攻占

    Description 小铭铭最近获得了一副新的桌游,游戏中需要用 m 个骑士攻占 n 个城池. 这 n 个城池用 1 到 n 的整数表示.除 1 号城池外,城池 i 会受到另一座城池 fi 的管辖, ...

  9. BZOJ 2761: [JLOI2011]不重复数字 hash哈希

    题目就不贴了 点我看题 题意:这题题意很简明,就是给一个序列,把序列里相同的删掉,然后输出,按原数列顺序. 思路:这题之前QZZ和ZN大神犇叫我去做,辣时还不会hash,就留着了.最近某夏令营学会了h ...

  10. 爬虫框架Scrapy之Item Pipeline

    Item Pipeline 当Item在Spider中被收集之后,它将会被传递到Item Pipeline,这些Item Pipeline组件按定义的顺序处理Item. 每个Item Pipeline ...