很多时候我们做web开发往cookie里面存数据,只是为了在不同的网页之间跳转的时候可以共享数据,但是cookie里面的每个数据不管是否需要都会在每个同域的http请求中被发送往服务器,包括每个页面、图片、css、脚本或者ajax的的请求,这就无形中占用了多余的带宽。更糟糕的是,一个网页的cookie本来也只有有限的4k空间,一旦不小心写入的cookie超过了限制,就会造成原来有用的cookie丢失,这样造成的bug非常难以追查。
因此我们在IE下面经常使用userdata来保存共享数据。但是在firefox下面却一直缺乏对应的特性。
今天在看firefox 2.0的
what's new 的时候,惊奇的发现一个新特性叫做:
Support for
client-side session and persistent storage赶紧试验了一下,firefox2.0果然支持这个特性了。虽然还只能在session生命周期内使用(而不像ie的userdata可以指定有效时间),但是总算解决了cookie占用的问题了。
以前曾经写过一个只支持ie的
userdata管理器,现在可以升级了:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> UserData manager </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="emu">
<META NAME="Keywords" CONTENT="IE USER DATA manager">
<META NAME="Description" CONTENT="UserData manager">
</HEAD>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
var isIE = !!document.all;
if(isIE)
document.documentElement.addBehavior("#default#userdata");
function saveUserData(key, value){
var ex;
if(isIE){
with(document.documentElement)try {
load(key);
setAttribute("value", value);
save(key);
return getAttribute("value");
}catch (ex){
alert(ex.message)
}
}else if(window.sessionStorage){//for firefox 2.0+
try{
sessionStorage.setItem(key,value)
}catch (ex){
alert(ex);
}
}else{
alert("当前浏览器不支持userdata或者sessionStorage特性")
}
}
function loadUserData(key){
var ex;
if(isIE){
with(document.documentElement)try{
load(key);
return getAttribute("value");
}catch (ex){
alert(ex.message);return null;
}
}else if(window.sessionStorage){//for firefox 2.0+
try{
return sessionStorage.getItem(key)
}catch (ex){
alert(ex)
}
}else{
alert("当前浏览器不支持userdata或者sessionStorage特性")
}
}
function deleteUserData(key){
var ex;
if(isIE){
with(document.documentElement)try{
load(key);
expires = new Date(315532799000).toUTCString();
save(key);
}
catch (ex){
alert(ex.message);
}
}else if(window.sessionStorage){//for firefox 2.0+
try{
sessionStorage.removeItem(key)
}catch (ex){
alert(ex)
}
}else{
alert("当前浏览器不支持userdata或者sessionStorage特性")
}
}
saveUserData("emu","hello world !")
alert(loadUserData("emu"))
deleteUserData("emu")
alert(loadUserData("emu"))
//-->
</SCRIPT>
</BODY>
</HTML>
这个特性不能在本地网页上试验,必须把页面用某个服务器(apache或者iis都可以)发布后用firefox访问。