勉強したことのメモ

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

jquery.cookie.jsで「$.cookie is not a function」エラー

   2022/07/21  jQuery JavaScript

フロントエンド側でCookieを利用したい場合jquery-cookieを用いることが多いが同プラグインで実装した際、環境によっては「$.cookie is not a function」というエラーが発生し、Cookieの操作が行えないということがあった。以下に対応方法をメモ。

 

原因?

jquery-cookieは開発が終了しており、そちらが原因かもしれない(jQueryのバージョンが新しいとダメなのかも)。こちらのページが参考になった。

 

対応方法

jquery-cookieからjs-cookieに変更した。まず公式サイトからJSファイルをダウンロードするか以下CDNでJSファイルを呼び出す。

<script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.1/dist/js.cookie.min.js"></script>

異なるバージョンを使用したい場合は以下から探す。

https://www.jsdelivr.com/package/npm/js-cookie

 

次にソースコードを以下の通り書き換える。

//cookie取得
//旧バージョン
$.cookie('name');
//新バージョン
Cookies.get('name');

//cookie保存
//旧バージョン
$.cookie('name', 'value');
//新バージョン
Cookies.set('name', 'value');

//cookie削除
//旧バージョン
$.removeCookie('name');
//新バージョン
Cookies.remove('name');

互換性があるようで新バージョンでも過去記事の時間指定も行えた。

 

所感

jquery-cookieで実装したシステムは複数あるのでcookie関連でのエラーが出てきた時用に覚えておきたいところ。

 - jQuery JavaScript

  関連記事

ajaxのエラー詳細を取得する

success or errorで分岐処理はできるけど、 エラー詳細取れないの? ...

jQueryでshow/hideよりaddClass/removeClassの方が速い

diaplay:none/blockする際に最近はshow()/hide()を ...

日本地図のクリッカブルマップをjQueryで実装する方法(japan-map)

JavaScriptもしくはjQueryで日本地図を表示し、都道府県や八地方区分 ...

jQueryで画像(タグ内)のsrc情報を取得する場合

すぐに出てこなかったのでメモ。 $('#test').attr('src'); ...

jQueryでUNIXタイムスタンプの取得

jQueryでUNIXタイムスタンプを取得したい場合、 $.now()だけで取得 ...