localStorage存儲代替GET方式

做久了前端開發就會知道,有時候需要把頁面A的數據傳到頁面B上,用URL參數的形式會顯得累贅。而且瀏覽器和服務器對於URL的長度也有所限制。

瀏覽器

1、IE

IE瀏覽器(Microsoft Internet Explorer) 對url長度限制是2083(2K+53),超過這個限制,則自動截斷(若是form提交則提交按鈕不起作用)。

2、firefox

firefox(火狐瀏覽器)的url長度限制爲 65 536字符,但實際上有效的URL最大長度不少於100,000個字符。

3、chrome

chrome(谷歌)的url長度限制超過8182個字符返回本文開頭時列出的錯誤。

4、Safari

Safari的url長度限制至少爲 80 000 字符。

5、Opera

Opera 瀏覽器的url長度限制爲190 000 字符。Opera 9 地址欄中輸入190 000字符時依然能正常編輯。

服務器

1、Apache

Apache能接受url長度限制爲8 192 字符

2、IIS

Microsoft Internet Information Server(IIS)能接受url長度限制爲16 384個字符。
這個是可以通過修改的(IIS7)
configuration/system.webServer/security/requestFiltering/requestLimits@maxQueryStringsetting.

3、Perl HTTP::Daemon

Perl HTTP::Daemon 至少可以接受url長度限制爲8000字符。Perl HTTP::Daemon中限制HTTP request headers的總長度不超過16 384字節(不包括post,file uploads等)。但當url超過8000字符時會返回413錯誤。
這個限制可以被修改,在Daemon.pm查找16×1024並更改成更大的值。

4、ngnix

可以通過修改配置來改變url請求串的url長度限制。

client_header_buffer_size 默認值:client_header_buffer_size 1k

large_client_header_buffers默認值 :large_client_header_buffers 4 4k/8k

由於jsonp跨域請求只能通過get請求,url長度根據瀏覽器及服務器的不同而有不同限制。
若要支持IE的話,url長度限制爲2083字符,若是中文字符的話只有2083/9=231個字符。
若是Chrome瀏覽器支持的最大中文字符只有8182/9=909個。

既然對URL的長度有諸多的限制,那麼爲何不選用一種更“爽”的方式呢?
沒錯,就是LocalStorage

localStorageAPI跟sessionStorageAPI一樣,參考API

這裏提一下如果你的數據是Object或者Array時,爲了能夠在頁面B能正常拿到所需要的數據,那麼先轉爲字符串,然後在頁面B再轉回Object或者Array吧!

轉爲JSON字符串

localStorage.setItem('paramData', JSON.stringify(paramData));

轉爲JSON格式數據

JSON.parse(localStorage.getItem('paramData'));

用過localStorage會發現不會再想用GET拼接的方式了!實感!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章