超かみ砕いてWebの基本概念を説明してみた

クッキー・セッションって何ですか？

この質問にすぐに答えられなかった方は見てくださいねー。(すぐ読めます)

Webに関わる方には最低限知っておいて頂きたいWebの基本概念を超絶簡単にイメージできるようにするための記事です。

何かWeb系の本を読む前にざーっとここに書いてある内容を読んでおくと理解が進むと思います。

※以下の書籍を参考にかみ砕いて説明しています。

用語説明

クライアントサーバー

クライアント？サーバー？全然っ難しくないです。

クライアントは何かのサービスを受け取る人

今回でいえばサービス(Webページ)を受け取るブラウザのこと

サーバーとはサービスを提供する人

今回でいえばWebページを配信するコンピューターのこと

クライアントサーバーは現実世界で例えると簡単です。

マックを例にします。

• 商品を提供する店員さんがサーバー
• 商品を受け取るお客さんがクライアント

用語	マック	Web
クライアント	お客さん	ブラウザ
サーバー	店員さん	Webページを配信するコンピューター

リクエストとレスポンス

マックに行ったら商品を注文しますよねー。

WebではWebページを注文することをリクエストと呼びます。

商品を注文したら商品を受け取りますよねー。

Webでは注文して受け取ったWebページをレスポンスと呼びます。

HTTPプロトコル

ところで、マックでの注文の仕方って決まってますよね。

列に並んで、メニュー表からメニューを選んで、お金を払う。

お金払わないと注文できないですよね。

Webの世界にもリクエストの仕方に決まりごとがあり、

通信プロトコル(通信する際の決まりごと)と呼びます。

特にWebページの受け渡しをやり取りする際の決まり事を

HTTPプロトコルというんです。

qiitaのホーム画面を表示したいときはブラウザに下記のURLを打ち込むと思います。
https://qiita.com

このURLの先頭の https(http)がHTTPプロトコルで通信しますよということを表しています。

ステートレスとステートフル

ステートというのは状態という意味なんですけどこれも現実にたとえていきましょう。

散髪屋さんに行ったとします。

高級な散髪屋さんはサービスが充実しているので、あなたが前に来たことを覚えてくれています。

２回目以降あなたが高級な散髪屋さんに行くと店員さんは、前回と同じ髪型にしますか？と聞いてくれます。

1000円カットの散髪屋さんはいちいちあなたが来たことを覚えてくれていません。

2回目以降来店しても毎回どんな髪型にしますか？と聞かれます。

状態を持つ→前回来店したお客さんを覚えている(高級散髪屋)
状態を持たない→前回来店したお役さんを覚えていない(1000円カット)

Webの世界に戻ります。

結論を先に言うとHttpプロトコルでの通信(Webページのやり取り)は状態を持ちません(ステートレス)。

つまり、Webページを提供しているサーバーがこのクライアントからのリクエストは前回も来たなー　

とは覚えておらず、毎回始めてきたお客さんのようにふるまうということです。

覚えておいてくれた方がリッチじゃんと思うかもしれないですが処理層度を上げるためにHttp通信では

ステートレスが採用されているのです。

クッキー

するどい方はこういう疑問を持つかもしれません。

アマゾンで買い物する時ログインしている間は、商品ページ画面や商品購入ページなどに移動しても

自分がこの商品を見て、自分がこの商品を買おうとしているということが分かっているじゃないか！

HTTPって本当にステートレスなの？　と。

はい、HTTPはステートレスです。それは変わりません。

しかし、HTTPを拡張してステートを持たせることを可能にした技術がクッキーなのです。

クッキーとはブラウザがあなたのPCに保存するただのテキストファイルです。

クッキーにはどんな情報が保存されているのでしょうか？

それはあなたが特定のサーバーに対してリクエストを送った際に、サーバー側で発行される識別子です。

識別子って言っても全然難しくなくて、他の人とかぶってしまわないくらい長い適当な文字列です。

もう一度あなたが同じサーバーに対してリクエストを送る際に、クッキーも添えて送るんです。

サーバーはクッキーに保存されているあなたのリクエストだと判別できる文字列を見て

これは前にリクエストしてきてくれたあなたのリクエストだと判定しています。

HTTP通信でステートを持てる理由が分かったと思います。

ちなみにログアウトするとクッキーは削除されるので、ログアウト後はステートレスになります。

セッション

Webページ(アマゾンなど)にログイン
　　　　　　　↓
　　　　　商品を選択
　　　　　　　↓
　　　　　商品を購入
　　　　　　　↓
　　　　　ログアウト

このように
クッキーを使用してサーバーと通信する一連の流れをセッションといいます。

最後に

超かみ砕いてWebの用語を説明してみました（笑）。

Webってなんかエンジニアとかしかわからない難しいものみたいに思われがちですが、

ほんとに誰でも理解できます。

というかWebってこんなにシンプルに実装されていたんだと逆に感動すると思います。

皆さんのWebへの架け橋になるような記事になることを願っています😊。