第8回 デザイナーと学ぶプログラミング@Cookieその1

こんにちは!最近毎日青汁を飲んでいる橋浦です!
 
今回はCookieについて一緒に勉強していきましょう。
Cookieってなんぞや?という所からjQueryで実際にCookieを発行する所までやっていくつもりです。
僕も勉強したてで色々至らぬ内容になるかもしれませんが、ご了承、ご指摘頂ければ幸いです。
ぜひお付き合いください!

 

Cookieってなーに?

Cookieは、アクセスした Webサイトをそのサイトに識別に使用することによって与えられる小さなテキストベースのファイルです。Cookieは、Web サイト上の別のページに移動した後、Webサイトに再度戻った際に状態情報を維持するために使用されます。
(Microsoft Cookieの説明より引用)
 
Cookieはどこにあるのかというと、ハードディスク上にあります。
初めて訪れるWebサイトでは、アクセスした段階で配布されます。
実は僕は今まで、CookieってWebサイトがサーバー側で持ってる情報なのかな?とか思ってました…。まぁ、だとしたらブラウザの設定で消せるのはおかしいですよね。
 
使用例として分かりやす所では、オンラインストアのカート機能やユーザー名の保存機能でしょうか。
オンラインショッピングをしていて、カートに商品を入れた状態で一度Webサイトを離れても、もう一度訪れたときにカートに商品が入りっぱなしになっていますよね。また、「ようこそ、○○○○様」といったようにユーザー名が表示されていたり。そういった情報の保持がCookieの主な使用方法です。
 
ハードディスクに保存されるって危なくないの?と思った方がいたら僕とお友達になりましょう。
僕も最初そう思ったのですが、基本的に自分が入力した項目以外でCookieからWebサーバーが知る事ができるのは、
自分が配布したCookieをユーザーがもっているかどうか程度なので安心なのです。
ウィルス等はあからさまに怪しいサイトからしか貰わないので、そういう所には日頃から近づかないようにしましょう。
 

Cookieってどんな形なの?

JavaScriptで発行されるCookieは文字列で発行され、その形も文字列です。
形を覚えることで発行の仕方と読み取り方がスムーズにこなせるようになるので、覚えていきましょう!
 
基本的な形は
Set-Cookie: NAME=VALUE; expires=DATE;
こんな感じ。
Set-CookieでCookieを定義して、その下に情報が入ります。
情報は全て[属性=値]の形になっています。Cookieは全てこの形で発行され保持されます。
Cookieを参照して何か処理をしたいときは、まずこの名前を探してそこから名前に与えられている値を参照します。

Cookieに与える事ができる属性

  • NAME=VALUE
  • expires=DATE
  • domain=DAMAIN_NAME
  • path=PATH
  • secure

ここでは最低限覚えて欲しい二つをピックアップして以下で紹介します。
 
・NAME
最初に言うと、このNAME属性は必須なので必ず入れてください。大事な属性です!
基本的になんでも入れられますが、セミコロン、カンマ、スペースを入れる場合はエンコード推奨です。
また、全角日本語を使う場合でもエンコードが必要になります。
 
・expires
expires属性は、Cookieの有効期限を定義する日付の文字列を設定します。
一度有効期限に達すると、Cookieはクライアントに保存されません。
もしくはクライアントからサーバーに送信されません。
日付文字列のフォーマットは以下のとおりです。
Wdy, DD-Mon-YYYY HH:MM:SS GMT
これは、RFC 822, RFC 850, RFC 1036, RFC 1123に基づいています。ただし、法定タイムゾーンは、GMTのみです。また日付の各要素間は、ダッシュ(「-(ハイフン)」のこと)で区切られなければいけません。

Thu, 1-Jan-2014 00:00:00 GMT
 
その他の3つは、最後に紹介しているfutomi’s CGI Cafe様で詳しく説明されています!
 

今回はここまで

今回はここまでです!
次回は実際にCookieをjQueryで発行してみたいと思います!
では、また次回!
 

参考にさせて頂いたサイト様(敬称略)

so-zou.jp
futomi’s CGI Cafe



❏❏ TOPIC ❏❏ ------------------------------------------------------------

カスタム自由!フリーECサイトパッケージ
チャットボット導入サービス
WEBシステム開発・スマホアプリ開発はSRIAへ