本文へ移動
カテゴリ

Webマーケ

Webマーケの記事すべてSEOサイト運営データマネジメントビジネス・マーケ概論広告

インタビュー

インタビューの記事すべて

おすすめサービス

おすすめサービスの記事すべて

おすすめ勉強法

おすすめ勉強法の記事すべて

おすすめ書籍

おすすめ書籍の記事すべて

データサイエンス

データサイエンスの記事すべてデータ解析品質工学多変量解析機械学習生成AI統計学

プログラミング

プログラミングの記事すべてPythonRSQLプログラミングスクール

スタビジについて

記事一覧運営者情報お問い合わせ

ローカルストレージとクッキー(Cookie)の違いは?ローカルストレージはどこで確認できるの?

目次

こんにちは!

デジタルマーケター兼データサイエンティストの(@statistics1012)です!

デジマ業界で猛威をふるっているITPの問題。

そんなITPに対して、有効な対策手段と考えられているのがLocalStrage(ローカルストレージ)。

ただローカルストレージを用いた対応は後々さらなるITPのアップデートで規制されてしまう可能性が高いんですけどね!

※クロスサイトトラッキングに関してはローカルストレージも規制対象になりました。トホホ・・

ITP2.3とは?とうとうローカルストレージが規制対象に!こんにちは!デジタルマーケターのウマたん(@statistics1012)です! 前回のITP2.2から意外と間が空いて

ローカルストレージはクッキーと同じにみえて実はちょっと違う!

この記事では、そんなローカルストレージについて見ていきます。

ウマたんウマたん

ローカルストレージとは何なのだろう?ローカルストレージとクッキーの違いはどこなんだろう?

ローカルストレージとは

ローカルストレージとは、端的に言うと「情報をブラウザ上に保存しておく場所」。

例えば、ユーザーがあるサービスにログインした場合、ログイン情報をローカルストレージ上に保存しておくことで、次回ユーザーが訪れた時に自動ログインが完了しているパターンなどが考えられます。

ユーザーの情報等を半永久的にブラウザ上に入れておける箱と考えてもらえばよいです。

HTMLのバージョン5である、HTML5からローカルストレージは登場しました。HTML5自体は2014年に登場し、今ではほぼ全てのブラウザに対応していますので、ローカルストレージもほぼ全てのブラウザ上で使用することが可能です。

ローカルストレージとクッキーの違い

クッキーも同様にユーザーの情報を入れて置ける箱であり、ローカルストレージと概念的にはほぼ変わりません。

しかし実は、ローカルストレージはクッキーの後継的技術と言われていて、クッキーとは違う特徴があるんです。

容量が多い

クッキーは4KBの容量しか保存しておけないのに対して、ローカルストレージは5MBの容量を保存しておくことが可能です。

半永久的に保存

ローカルストレージは半永久的に保存されますが、クッキーは指定した期間の保存になります。

一般的に1年や2年という期間で保存されることが多いです。

ITPの影響でクッキーはファーストパーティクッキーが1日保存、サードパーティークッキーが保存されない、となっています。

ファーストパーティクッキーとサードパーティクッキーの違いは以下の記事をご覧ください。

サードパーティクッキーとファーストパーティクッキーの違いとは?こんにちは! データサイエンティストのウマたん(@statistics1012)です! 最近何かと話題のクッキー(Coo

サーバーのデータ送信

クッキーの場合、HTTP通信の度に全てのクッキー情報をクライアント側からサーバー側に渡していました。

しかし、そうするとクッキー情報が多ければ多いほど重くなり、かつセキュリティ上も問題が発生する可能性が高いです。

ローカルストレージでは、必要なデータ利用時のデータ送信が行われます。

ウマたんウマたん

クッキーにもデメリットしかないわけではなく、メリットの1つに幅広い互換性があるよ。ほぼすべてのブラウザやサーバー側でサポートされてるから古いシステムや環境でも利用可能なんだ!

ローカルストレージの確認方法

それでは、ローカルストレージはどこで確認することができるのか見ていきましょう!

クロームブラウザのディベロッパーツールから確認することができます。

適当なページ上でCtrl+Shift+Iを押してみましょう!

そうすると以下のような画面が表示されるはず。

タブのアプリケーションの押すと左側にローカルストレージやクッキーなどの表示が出てきます(赤で囲っているのはクッキー)

ちなみにこのクッキーやローカルストレージは自由に書き換えることが可能なんですよー!

ローカルストレージへの書き込み方

ローカルストレージにデータを書き込んだり、書き換えたり、削除したりするのは非常に簡単!

データを書き込みたい場合は以下の一行を記述しましょう!

例えばディベロッパーツールのコンソール画面で以下のように書き込むと、ローカルストレージにちゃんとデータが入っているのが確認できます。

データを取り出したい場合は、

削除したい場合は、

ウマたんウマたん

自分の手でやってみよう!

ローカルストレージ まとめ

本記事では、ローカルストレージについて見てきました。

クッキーの後継としてITPの流れで注目されているローカルストレージ。

最後にローカルストレージのクッキーとの違いについてまとめておきましょう!

マーケティングやWebマーケティングについて学びたい方は以下の記事をチェックしてみてください!

【何から学ぶ?】マーケティングの独学勉強法とおすすめサイトをまとめていく!当サイト【スタビジ】の本記事では、マーケティングの勉強範囲と勉強方法について徹底的にまとめていきます。3年間で必死にマーケティングを独学で勉強してきたノウハウを結集させて必ずあなたをマーケティングを習得できる道のりの第1歩目までおしあげます。 独学でWebマーケティングを勉強して稼げるようになるロードマップ!当サイト【スタビジ】の本記事では、Webマーケティングの勉強法についてまとめていきます。Webマーケティングは、これからの世の中を生き抜く上で非常に重要なスキル。Webマーケティングをインプットし実践まですることで初めて身に付きます。この記事ではインプット編と実践編に分けて解説していきますよ!
スポンサーリンク

ウマたんスタビジ編集長

大学院は理系の統計科学研究室で、ベイズ統計学・時系列分析・異常検知を研究。日系・外資の消費財メーカーのデータサイエンティストを経て、現在は会社を経営しながらデータサイエンティストとして働いています。

スタビジアカデミー

読んだ内容を、手を動かして身につける

データサイエンス・AIを、動画と課題で体系的に学べるオンラインスクール。

スタアカを見てみる