Cookie について確認・検証した時のメモ。

Cookie について

Wikipedia の内容が分かりやすい気がします。

HTTP cookie

• HTTP はステートレスなプロトコルである
• 一方、ショッピングサイトのカートなど同じユーザーが操作を行った場合、サーバー側ではアクセスしユーザーを特定し、カート一覧を表示するというユースケースが有る
• 上記を解消する方法の一つとしては Cookie がある
• Cookie では次のようにサーバとクライアント間の状態を管理

1.ウェブサーバがウェブブラウザにその状態を区別する識別子をHTTPヘッダに含める形で渡す。
2.ブラウザは次にそのサーバと通信する際に、与えられた識別子をHTTPヘッダに含めて送信する。
3.サーバはその識別子を元にコンテンツの内容をユーザに合わせてカスタマイズし、ブラウザに渡す。必要があれば新たな識別子もHTTPヘッダに含める。
以降2、3の繰り返し。

• Cookie でデータを直接扱うよりもセッション ID を実装する手段として使うことが多い。この場合、実際のデータは、セッション ID をキーとしてサーバが保持する(セッション ID をサーバーで生成し、関連する情報はサーバー側で保持する。例えばユーザーごとにセッション ID を生成し、関連するショッピングカート情報は DB に保持するなど）

仕様について

Cookie を設定した場合、サーバー側で HTTP レスポンスで Set-Cookie ヘッダーを指定します。
書式や詳細は以下。

Set-Cookie

key=value 形式で cookie-name=cookie-valueを指定します。
もし、対象の Cookie について追加で有効期限を設けたい場合、Expires を指定します。
例えば以下のように書くことで「type=ninja」という Cookie を設定します。

Set-Cookie: type=ninja; Expires=Tue, 19 Jan 2038 03:14:07 GMT

Set-Cookieが設定された場合、必要に応じてブラウザは Cookie HTTP リクエストヘッダーを指定します。
書式や詳細は以下。

Cookie

先程記載した Set-Cookie が設定された場合、HTTP リクエストの際には以下のように設定されます。

Cookie: type=ninja

検証

Node.js を使って以下のコードを書きました。
Node.js のバージョンは v10.0.0です。

var http = require('http');

http.createServer(function (req, res) {

    res.setHeader('Content-Type', 'text/html');
    res.setHeader('Set-Cookie', ['type=ninja; Expires=Tue, 19 Jan 2038 03:14:07 GMT', 'language=javascript']);

    res.end('Hello World\n');

}).listen(80); // 127.0.0.1の80番ポートで待機

ヘッダーの書き方は以下を参考にしています。

response.setHeader(name, value)
response.setHeader('Set-Cookie', ['type=ninja', 'language=javascript']);

この場合、以下の2つの Cookie を設定しています。

• type = ninja
• language = javascript

そして「type = ninja」の方には Expires を設定し、有効期限を設定しています。

実際にリクエストしてみます。

$curl http://13.230.4.195/ -v
*   Trying 13.230.4.195...
* TCP_NODELAY set
* Connected to 13.230.4.195 (13.230.4.195) port 80 (#0)
> GET / HTTP/1.1
> Host: 13.230.4.195
> User-Agent: curl/7.54.0
> Accept: */*
>
< HTTP/1.1 200 OK
< Content-Type: text/html
< Set-Cookie: type=ninja; Expires=Tue, 19 Jan 2038 03:14:07 GMT
< Set-Cookie: language=javascript
< Date: Sun, 21 Jul 2019 05:06:04 GMT
< Connection: keep-alive
< Content-Length: 12
<
Hello World
* Connection #0 to host 13.230.4.195 left intact

HTTP レスポンスでSet-Cookie が設定されている点が確認出来ました。

次に、ブラウザ(Chrome)でも確認してみます。
DeveloperTool の Network 画面を使って HTTP リクエスト・レスポンスの状況を確認します。

初回のリクエスト時には以下のようになっており、HTTP レスポンスで Cookie が設定されている事が分かります。

再度同じ URL にアクセスしてみます。

今度は HTTP リクエストで Cookie が設定されています。
具体的な HTTP リクエストの設定内容 Headers の内容から確認します。

Cookie HTTP リクエストヘッダーにおいて設定した Cookie の情報が正しくサーバーに送信されている点が確認出来ました。