JavaScriptでCookieを取り扱う「js-cookie」ライブラリの利用方法
「jquery-cookie」プラグイン開発終了に伴い「js-cookie」ライブラリを利用するようになった。以前に簡単な使い方に関しては書いたものの、詳細をまとめていなかったのでそのあたりを以下にメモ。また、先日触れたSecure属性の設定方法もあわせてメモ。
GitHub
https://github.com/js-cookie/js-cookie
CDN
CDNで使う場合は以下を記述する。
<script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.5/dist/js.cookie.min.js"></script>
利用方法
基本的な使い方
//取得
Cookies.get('name');
//保存
Cookies.set('name', 'value');
//削除
Cookies.remove('name');
保存期間指定
//日数で指定
const option = { expires: 1 }; //1日
Cookies.set('name', 'value', option);
//秒数で指定
const expires = new Date();
expires.setTime( expires.getTime() + ( 1000 * 60 * 60 * 24 )); //1000ミリ秒 * 60秒 * 60分 * 24時間 = 1日
const option = { expires: expires };
Cookies.set('name', 'value', option);
Secure属性設定
const option = { secure: true };
Cookies.set('name', 'value', option);
関連記事
-
-
サイトをダークモード対応させる「Darkmode.js」ライブラリの利用方法
サイトをダークモード対応させる場合、CSSで色々指定しないといけないと思っていた ...
-
-
JavaScriptで画像読み込み完了のタイミングを検知する「imagesLoaded」ライブラリの利用方法
大き目のサイズの画像をページに設置すると読み込み完了まで時間がかかる。その画像が ...
-
-
JavaScript / PHPにて「lz-string」を用いてデータの圧縮・展開する方法
文字数が多いGETパラメータを送信したいというケースがあった。また、送信側はJa ...
-
-
JavaScriptにてカラーコードのピッカーを実装できる「jscolor」の利用方法
フォームのテキストボックスにカラーコードのピッカーを実装したかった。HTMLのみ ...
-
-
簡単にスケルトンローディングを実装できる「phantom-ui」ライブラリの使用方法
あるサイトでページを読み込んだ際、最初は各レイアウトの枠組み的な部分を表示、次に ...