1. 程式人生 > >關於頁面傳參,decodeURI和decodeURIComponent

關於頁面傳參,decodeURI和decodeURIComponent

  之前寫過一個關於頁面傳參的,但是是前端相對於自己的頁面做的跳轉,也就是頁面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 }];

這裡就是需要傳輸的資料,然後對應的頁面的話,請看下面的圖片。

相信大家一眼就能看出來,room_name就是這個房間的名稱,然後arr陣列中,存放的就是這個參賽人員的資料,其中包括,參賽者的頭像,姓名,id,得分情況。這個java後臺要傳輸給我的。

經過我們的測試,後臺給了我一個他encodeURI之後的資料,我這裡也貼在下面,為了方便大家複製,我以程式碼的形式寫在下面:

?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個):!#$&'()*+,/:;[email protected]_~0-9a-zA-Z
  • encodeURIComponent(71個):!'()*-._~0-9a-zA-Z

  相信到這裡大家就明白了,java後臺的編碼方式是encodeURIComponent,而我使用的是decodeURI解析的,造成了解析不完整。所以以後碰到這樣的問題,首先是把這個編碼的連結放在線上的解析連結的網站上,看看是不是能正常的解析出來哦我們想要的結果,如果得到了,那就需要看咱們的程式碼是不是decode錯誤了,反正就兩種,自己試一下就可以了。