1. ホーム
  2. ジャバスクリプト

[解決済み】JavaScriptでクッキーを名前で読み取るための最短関数は何ですか?

2022-04-05 17:53:06

質問

JavaScriptでCookieを読み取るための、最短で、正確で、クロスブラウザに互換性のある方法は何ですか?

スタンドアローンのスクリプト(外部との依存関係がない)を作っているときに、クッキーを読み取る関数を追加することがよくありますが、大抵は QuirksMode.org readCookie() メソッド(280バイト、最小化216バイト。)

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}

それは仕事をしますが、醜く、毎回かなり肥大化します。

というメソッドは jQuery.cookie はこのようなものを使っています (modified, 165 bytes, 125 minified)。

function read_cookie(key)
{
    var result;
    return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? (result[1]) : null;
}

備考 これは「コードゴルフ」の大会ではありません。私は、readCookie関数のサイズを小さくすることと、私が持っているソリューションが有効であることを確認することに、正真正銘の興味があります。

解決方法は?

現在のベストアンサーより短く、より信頼性が高く、より高性能である。

const getCookieValue = (name) => (
  document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)')?.pop() || ''
)

様々なアプローチによる性能比較を示します。

http://jsperf.com/get-cookie-value-regex-vs-array-functions

アプローチに関する注意点

正規表現によるアプローチは、ほとんどのブラウザで最速であるだけでなく、最短の関数を生成します。加えて、以下のように 公式仕様書 (RFC 2109) document.cookieのcookieを区切るセミコロンの後のスペースはオプションであり、これに依存すべきではないという主張が成り立つかもしれません。さらに、等号(=)の前後にはホワイトスペースが許され、この潜在的なホワイトスペースは信頼できる document.cookie パーサーに考慮されるべきであるという主張ができます。上記の正規表現は上記の両方の空白の条件を考慮に入れています。