欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

关于页面传参,decodeURI和decodeURIComponent

程序员文章站 2022-04-04 14:50:01
之前写过一个关于页面传参的,但是是前端相对于自己的页面做的跳转,也就是页面1,跳转到页面2,里面带的参数。这里可以参考我上一篇文章,包括里面参数中如果有数组和json格式的情况。但是需要注意的是,我前面说的都是前端自己开自己的页面,按照我上面的操作是没有问题的,昨天的时候,发现了一个大问题,事情是这 ......

  之前写过一个关于页面传参的,但是是前端相对于自己的页面做的跳转,也就是页面1,跳转到页面2,里面带的参数。这里可以参考我,包括里面参数中如果有数组和json格式的情况。但是需要注意的是,我前面说的都是前端自己开自己的页面,按照我上面的操作是没有问题的,昨天的时候,发现了一个大问题,事情是这样的,数据都是java后台获取的,然后后台会给一个按钮附上链接,页面中的所有数据都是从这个链接中获取的。咱们先看下我们需要的数据是什么样的。

 1         var room_name = "房间名称(999999)";
 2         var arr = [{
 3             "heard_img":"./img/timg.jpg",
 4             "id":123454,
 5             "score":1024,
 6             "name":"大雪"
 7         },{
 8             "heard_img":"http://img.duoziwang.com/2016/12/18/042435159529.jpg",
 9             "id":123452,
10             "score":1022,
11             "name":"大雪2"
12         }];

这里就是需要传输的数据,然后对应的页面的话,请看下面的图片。

关于页面传参,decodeURI和decodeURIComponent

相信大家一眼就能看出来,room_name就是这个房间的名称,然后arr数组中,存放的就是这个参赛人员的数据,其中包括,参赛者的头像,姓名,id,得分情况。这个java后台要传输给我的。

经过我们的测试,后台给了我一个他encodeuri之后的数据,我这里也贴在下面,为了方便大家复制,我以代码的形式写在下面:

关于页面传参,decodeURI和decodeURIComponent
?room_name=%25e6%2588%25bf%25e9%2597%25b4%25e6%25a0%2587%25e9%25a2%2598%2528123456%2529&arr=%255b%257b%2522score%2522%253a1000%252c%2522name%2522%253a%2522%25e6%2588%2591%25e6%2598%25af%25e7%258e%25a9%25e5%25ae%25b60%2522%252c%2522id%2522%253a999990%252c%2522heard_img%2522%253a%2522https%253a%252f%252fwww.gushaoyang.cn%252fbg.png%2522%257d%252c%257b%2522score%2522%253a500%252c%2522name%2522%253a%2522%25e6%2588%2591%25e6%2598%25af%25e7%258e%25a9%25e5%25ae%25b61%2522%252c%2522id%2522%253a999991%252c%2522heard_img%2522%253a%2522https%253a%252f%252fwww.gushaoyang.cn%252fbg.png%2522%257d%252c%257b%2522score%2522%253a0%252c%2522name%2522%253a%2522%25e6%2588%2591%25e6%2598%25af%25e7%258e%25a9%25e5%25ae%25b62%2522%252c%2522id%2522%253a999992%252c%2522heard_img%2522%253a%2522https%253a%252f%252fwww.gushaoyang.cn%252fbg.png%2522%257d%252c%257b%2522score%2522%253a-1500%252c%2522name%2522%253a%2522%25e6%2588%2591%25e6%2598%25af%25e7%258e%25a9%25e5%25ae%25b63%2522%252c%2522id%2522%253a999993%252c%2522heard_img%2522%253a%2522https%253a%252f%252fwww.gushaoyang.cn%252fbg.png%2522%257d%255d
view code

大家可以把这个url后面的参数直接放在现在的那种网站直接解析一下。这里给附上一个链接,百度到的随便哪一个都行。发现是能解析的,只要解析两次就可以了。但是发现到了程序中,使用两次decodeuri是不能正常解析的。解析出来以后,就是想没有解码完成似的,还有的没有给解开。经过旁边的php工程师的指点,应该是解码的方式不一样,导致了解码不完全,昨天我就在网上慢慢的寻找,终于知道了一个叫做decodeuricomponent的东西。这个是可以正常解码的。

  下面来具体的说一下,这两种解码的区别。其实就是这两种编码的区别,首先我们要知道编码是按照什么标准执行的,下面是我找到的资料,我就直接写在下面了,

rfc3986文档规定,url中只允许包含英文字母(a-za-z)、数字(0-9)、-_.~4个特殊字符以及所有保留字符。rfc3986文档对url的编解码问题做出了详细的建议,指出了哪些字符需要被编码才不会引起url语义的转变,以及对为什么这些字符需要编码做出了相应的解释。

下面列出了这三个函数的安全字符(即函数不会对这些字符进行编码)

  • escape(69个):*/@+-._0-9a-za-z         这个基本上不会用到了,这里就不解释了。
  • encodeuri(82个):!#$&'()*+,/:;=?@-._~0-9a-za-z
  • encodeuricomponent(71个):!'()*-._~0-9a-za-z

  相信到这里大家就明白了,java后台的编码方式是encodeuricomponent,而我使用的是decodeuri解析的,造成了解析不完整。所以以后碰到这样的问题,首先是把这个编码的链接放在在线的解析链接的网站上,看看是不是能正常的解析出来哦我们想要的结果,如果得到了,那就需要看咱们的代码是不是decode错误了,反正就两种,自己试一下就可以了。