ENGINNER

【初心者向け】cookie(クッキー)とsession(セッション)とは?

こんにちは。もんしょー(@sima199407)です。

悩んでいる人
悩んでいる人
cookieとsessionって何が違うんだろう?

という疑問があるかと思います。

これについてもう少し詳しく解説していきます!

動画でも解説してます

キーワードから申しますと、「保存する場所」です。

「保存するっていうことはなんとなく分かるんだけど結局なに?」

「cookieってなんですか?お菓子ですか?」

という人でも理解できる内容にしました。笑

クッキー(cookie)とは?

結論から言うとブラウザ側で持っているファイルです。

これだけだとよく分からないですね。

何となく保存しているというのは分かるとは思うのですが、具体的にどういうことかというと、

サイトへのユーザログイン情報とかオンラインショップのカート機能とか、Webサイトで将来必要になるであろうユーザ情報・商品の購入情報などをスマホとかPC内のブラウザの中にあらかじめ置いておくことです。

実は情報は自分だけのモノじゃない

Cookieが裏側でやってることがもう一つあります。

これが重要なことで広告です。

自分が閲覧した情報とかそれに似たWeb上に広告が出てくるとか思います。

例えば、

新しく引越ししようと思って賃貸物件を調べていたら、全然関係ないYahooページのサイドバーに「渋谷1K、9万円!」とか出てくる

とか

転職とか考えている人で色々と転職サイトとか見ていった時に「Webエンジニア年収〇〇」という感じで広告が出る

ときがあると思います。

これはcookieの情報から判別して出しているのです。

ちなみにサードパーティcookieといういろんな情報共有してその人に合った広告を出しているという仕組みなんですけども、そういったものがcookieの仕組みです。

Cookieとは?

ユーザ情報、商品のカート情報をまとめる機能、広告を出すために使われています。

セッション(session)とは?

よくcookieとsessionをワンセットで覚えると思います。

sessionを一言でいえば、サーバ側に保存されているデータです。

これだけだと何となくはわかるけど分かりにくいと思ってて、

cookieデータはブラウザ上、つまりパソコン上で持っているのがcookieのデータで、yahooやAmazonが持っているサーバ上にあるのがsessionです。

特徴

sessionというのはsessionIDというものが発行されます

sessionIDを1つのキー、合言葉みたいな感じです。

そのキーを使ってサーバに保存している情報を見る感じです。

何となくの理解で良いのですが安全性で言えば、cookieよりもsessionの方が高いです。

sessionとは?

暗号で開くサーバーに保管された情報

キャッシュって?

cookieとsessionと来たら次はキャッシュですね。

Web開発をする時によくあるのですけどフロント側で例えばCSSを変更した時に全然変更が確認できない

「あれ?変更したのに色変えたのに全然変更されてないな?」っていう場面があります。

その現象にはキャッシュが働いています

cookieと似ていると思うかもしれないですけども、CSSとかファイルとか閲覧ページとかを保存しておくというのがキャッシュになります。

キャッシュとは?

ページにあるHTMLやCSSなどのデータ

キャッシュを残さない方法

ちなみにページのキャッシュをクリアしたいという時に簡単な方法があります。

Macの場合キーボードのShift+command+Rです。

Windowsの場合は、Crtl+Shift+Rです。

これをするとキャッシュがクリアされてCSSやHTMLなどの反映ができます。

スーパーリロードという言葉で覚えておくといいと思います。

よく現場で修正後にこっちが「修正しました!」と言ってもWebに詳しくない人だと「修正全然されてないんだけど」というふうに言われる可能性があります。

そういう時に「キャッシュクリアしてください!」と言います。

もし「変更されてないんだけど」と思ったらもしかしたらキャッシュのせいかなと思っていただけると解決しやすいと思います。

ブラウザによって違う

ちなみにキュッシュが残りやすいブラウザというのがあります。

Web開発の時によく使うのですけどGoogle Chromeです。

肌感覚でキャッシュが残りにくいブラウザは、Internet Explorer(IE)ですね。

ただIEは厄介ものというか曲者なので僕はあんまり使わないですけども。

キャッシュが残りやすいというものもあるのでそこら辺は注意していきましょう。

まとめ

1つ目、cookieはブラウザに残る履歴ファイル!

ユーザ情報やカートの商品情報などがブラウザに残ります。

2つ目、sessionとはサーバに保存されているデータ!

サーバになって尚且つセキュリティレベルの高いと言われているのがセッションです。

3つ目、キャッシュは閲覧したページの一時保存ファイル!

閲覧したページなのでそのページを変更した時に変更が反映されていない時にはキャッシュをクリアして新しい物を反映させましょう。

今回のまとめです。

・cookieはブラウザに残る履歴ファイル
・sessionとはサーバに保存されているデータ
・キャッシュは閲覧したページの一時保存ファイル

あわせて読みたい
【初心者向け】インフラエンジニアとは?【年収と業務も】こんにちは。もんしょー(@sima199407)です。 という疑問があるかと思います。 動画でも解説してます http...
あわせて読みたい
【超初心者向け】開発環境とステージング環境の違いとは?【図解あり】こんにちは。もんしょー(@sima199407)です。 という疑問があるかと思います。 以前に以下のようなツイートを...