勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

JavaScriptでオブジェクトをzlib圧縮してCookieに保存できる「zcookies」ライブラリの利用方法

  JavaScript

あるシステムでCookieを保存している部分があった。ただ、日本語を保存している筈なのにブラウザの開発者ツールで確認するとランダム英数字で保存されていた。どうも「zcookies」というライブラリを使用しているようで、こちらはzlib圧縮してCookie保存⇔展開できるというライブラリみたい。以下に利用方法のメモ。

 

zcookies

GitHub

https://github.com/ukyo/zcookies

読み込み方法

CDNは無いっぽいのでこちらのページからzcookies.min.jsをダウンロードし、適当なディレクトリにアップロードすること。

特長・メリット

  • zlib圧縮されるためより多くのデータが保存できる。
  • オブジェクトをそのまま保存できる(js-cookieだとjson等に変換してから保存する必要あり)。
  • 保存されるデータの見た目がランダム英数字なので多少はセキュリティ対策になるかも?

 

利用方法

ソースコード

<script>
const data = {
    name: '田中', 
    age: 20,
};
zcookies.set('data', data); //data:"a1qSl5ibuuz5lA1PdqxdnJieKgIA"

const cookie = zcookies.get('data');
console.log(cookie); //Object { name: "田中", age: 20 }
</script>

解説等

コメントにも書いているがCookieを保存すると「a1qSl5ibuuz5lA1PdqxdnJieKgIA」というデータが保存される。展開すると元のオブジェクトして利用できる。

オプション項目

Cookie保存時のオプション項目はこちらのページを参照すること。

 - JavaScript

  関連記事

PHPで画像アップロード、リサイズ、形式変換(jpg->webp等)はclass.upload.phpが便利
PHPで画像アップロード、リサイズ、形式変換(jpg->webp等)はclass.upload.phpが便利

今までPHPで画像関連の処理を行う場合、リサイズの時のみsmart_resize ...

jQueryプラグインでクリップボードにコピーする方法(clipboard.js)
jQueryプラグインでクリップボードにコピーする方法(clipboard.js)

ページ上のボタンをクリックすることで特定の文章をクリップボードにコピーしたかった ...

PHPでOGPタグ(metaタグ)を簡単に取得できる「OpenGraph.php」の利用方法
PHPでOGPタグ(metaタグ)を簡単に取得できる「OpenGraph.php」の利用方法

PHPでOGPタグ(metaタグ)を取得する際、file_get_content ...

JavaScriptでlocalStorageを簡単に操作できる「store.js」ライブラリの利用方法
JavaScriptでlocalStorageを簡単に操作できる「store.js」ライブラリの利用方法

以前Dexie.jsを利用してIndexedDBを取り扱う方法をメモしたが、今回 ...

tableタグ内のデータをCSV形式でダウンロードできる「jQuery-csvExport」ライブラリの使用方法
tableタグ内のデータをCSV形式でダウンロードできる「jQuery-csvExport」ライブラリの使用方法

HTMLのtableタグ内のデータをCSV形式でエクスポートさせたいケースがあっ ...