JavaScript
jQuery

jquery.cookie.jsの使い方とCOOKIEの寿命(保存期間)を秒・分・時間で指定する方法

More than 5 years have passed since last update.

jquery.cookie.jsを使うと、JavaScriptからクッキーの書き込み&取得が簡単に行えるようになるんだけど、何故かmax-ageが無く、expiresでしか有効期限の設定が出来ないため、最も短い期間でも1日となる。

秒・分・時で制御する場合はnew Date()からsetTime()でミリ秒指定しなければならなかったので、プラグインの基本的な使い方と一緒にメモっとく。

-プラグインはこちら-

https://github.com/carhartl/jquery-cookie


cookieplugintest.js


// 書き込み方
$.cookie('名前', '値');

// 読み込み方
$.cookie('名前');
$.cookie('ありえない名前'); // 存在しない場合は undefindedが返る

// 削除
$.removeCookie('名前');

// 有効期限の設定:日数指定
$.cookie('名前', '値', { expires: 7 }); // 寿命は7日

// 30秒
var date = new Date();
date.setTime( date.getTime() + ( 30 * 1000 ));
$.cookie( "hoge", "30 seconds", { expires: date });

// 18分
date = new Date();
date.setTime( date.getTime() + ( 18 * 60 * 1000 ));
$.cookie( "hoge", "18 minutes", { expires: date });

// 5時間
date = new Date();
date.setTime( date.getTime() + ( 5 * 60 * 60 * 1000 ));
$.cookie( "hoge", "5 hours", { expires: date });

// 7日
date = new Date();
$.cookie( "hoge", "7 days", { expires: 7 });

// 有効範囲:パス または ドメイン
$.cookie('名前', '値', { expires: 7, path: '/' }); // パス
$.cookie('名前', '値', { expires: 7, domain: 'example.com' }); // ドメイン

// セキュリティ:true または false。デフォはfales
$.cookie('名前', '値', { expires: 7, secure: true });



jsonの自動パース機能が超便利!


cookieplugintest.js

// jsonの自動パース:

$.cookie.json = true;

// オブジェクトにまとめてといてそのまま突っ込める
var jsonData = new Object();
jsonData.title = "タイトル";
jsonData.url = "exsample.com";
jsonData.description = "概要";
$.cookie("jsonData", jsonData);