Cookie中文存储页面500问题

2018-06-24 00:12:52来源：未知阅读 ()

　　前段时间做cookie存储，直接用的菜鸟教程中的cookie设置方法，方法如下：

function setCookie(cname,cvalue,exdays)
{
  var d = new Date();
  d.setTime(d.getTime()+(exdays*24*60*60*1000));
  var expires = "expires="+d.toGMTString();
  document.cookie = cname + "=" + cvalue + ";" + expires+"; path=/";
}

　　以上的函数参数中，cookie 的名称为 cname，cookie 的值为 cvalue，并设置了 cookie 的过期时间 expires。

　　该函数设置了 cookie 名、cookie 值、cookie过期时间。

　　当用上面的cookie存储方法存储中文数据后，刷新页面发现页面报错，如下：

　　cookie中存储内容中有中文：

　　所有我们需要先对要存储的内容进行编码，然后再存储，这样才不会报错，下面用的encodeURI()函数做的编码。

function setCookie(cname,cvalue,exdays)
{
  var d = new Date();
  d.setTime(d.getTime()+(exdays*24*60*60*1000));
  var expires = "expires="+d.toGMTString();
  document.cookie = encodeURI(cname) + "=" + encodeURI(cvalue) + ";" + expires+"; path=/";
}

　　这样做存储，就可以解决cookie中文存储的问题了，然后注意的就是在获取cookie的时候，需要对数据进行decodeURI()解码，完整的demo：

<script type="text/javascript">
  function setCookie(cname,cvalue,exdays)
  {
    var d = new Date();
    d.setTime(d.getTime()+(exdays*24*60*60*1000));
    var expires = "expires="+d.toGMTString();
    document.cookie = encodeURI(cname) + "=" + encodeURI(cvalue) + ";" + expires+"; path=/";
  }
  function getCookie(cname)
  {
    var name = encodeURI(cname) + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++)
    {
      var c = ca[i].trim();
      if (c.indexOf(name)==0) return decodeURI(c.substring(name.length,c.length));
    }
    return "";
  }
  function alertCookie(){
    alert(getCookie('name'));
  }
</script>
<span onclick="setCookie('name','我',1);">设置cookie</span>
<span onclick="alertCookie();">获取cookie</span>