JavaScriptで値が空文字のcookieを取得したときのブラウザ間の違い

JavaScript で値が空文字のcookieを取得したとき、Chrome や Safari、Firefox では空文字（""）が返ってきますが、Internet Explorer （テストしたのは IE8）では undefined が返ってきます。

例えば、次のような setCookie 関数で "testcookie" という名前で空文字をセットします。

setCookie("testcookie", "", 1);

function setCookie(key, val, days){
 var cookie = encodeURIComponent(key) + "=" + encodeURIComponent(val);
 if(days != null){
 var expires = new Date();
 expires.setDate(expires.getDate() + days);
 cookie += ";expires=" + expires.toGMTString() + '; path=/;';
 }
 document.cookie = cookie;
}

これを次のような getCookie 関数で取得して alert で表示してみると、Chrome や Safari、Firefox では空文字となりますが、IE では undefined という文字列が表示されます。

getCookie1 を試す

function getCookie1(key) {
 if(document.cookie){
 var cookies = document.cookie.split(";");
 for(var i = 0; i < cookies.length; i++){
 var cookie = cookies[i].replace(/\s/g,"").split("=");
 if(cookie[0] == encodeURIComponent(key)){
 return decodeURIComponent(cookie[1]);
 }
 }
 }
 return "";
}

なので、IEでもちゃんと空文字になるようにするには、以下のように変更すれば良いと思います。

getCookie2 を試す

function getCookie2(key) {
 if(document.cookie){
 var cookies = document.cookie.split(";");
 for(var i = 0; i < cookies.length; i++){
 var cookie = cookies[i].replace(/\s/g,"").split("=");
 if(cookie[0] == encodeURIComponent(key)){
 var value = "" + decodeURIComponent(cookie[1]);
 return (value == "undefined" || value == "null" || value == "") ? "": value;
 }
 }
 }
 return "";
}