1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

初学者向けにCookieの概念と使い方を説明してみる

Last updated at Posted at 2022-04-04

#はじめに
本稿は初学者向けにCookieの概念から実際の使い方までを解説した記事になります。

Cookieが何のために存在して、どのように使うのかといったことをざっくり理解して頂ければ幸いです。

実際の使い方だけ学びたい方は、2 実際のCookieの使用方法から読んでください。

#目次
1 Cookieとは
1.1 そもそもCookieって何のためにあるの?
1.2 セッションとの違い
1.2.1 保存先
1.2.2 有効期間

2 実際のCookieの使用方法
2.1 Cookieを保存する
2.2 Cookieを呼び出す
2.3 設定したCoookieを確認する

#1 Cookieとは
ここでは、そもそもCookieとはなんぞや?という話をします。

#1.1 そもそもCookieって何のためにあるの?
Cookieを説明するにあたって、まずWebブラウザとサーバー間の通信について触れます。
まず、Webブラウザとサーバー間でデータをやり取りするために使われるHTTPプロトコル(通信の手続き)はステートレスという状態です。

つまり、Webページを表示しているサーバーは前のページからの続きなのか関連したアクセスなのか以前の状態を全く覚えていないということです。(HTTPプロトコルはステートレスであるという説明は難しいと思うので、最低限ここだけ分かっていれば良いです)

SNSを例に出すと、「ログインする」「自分のマイページに入る」「誰かの投稿を見る」といったような一連の機能があると思いますが、ステートレスな状態では「誰がログインしているか」「誰のマイページなのか」「誰の投稿を表示するのか」といったところが判別できないのです。

そのステートレスな状態を管理するために生まれた技術のひとつがCookieです。
SNSの例で言うと、「ログインしているのは○○さん」「表示すべきマイページは○○さん」「○○さんの投稿を表示する」といった情報をCookieを使って保存しています。
サイトにアクセスする際にこれらの情報を呼び出すことによって、それぞれのユーザーがそれぞれの画面でSNSを利用することができます。

そして、Cookieが保存する情報はWebサーバーが発行し、Webブラウザ上に保存されるという特徴を持っています。(ちなみに保存する技術名だけでなく、保存される情報のことも一般的にCookieと呼びます。)
ブラウザは同じサイトにアクセスする際にはそのCookieをWebサーバーに送信し、
Webサーバーはブラウザからのリクエスト毎にCookieが保存した情報を参照することができます。

実はCookieの用途はこれだけではないのですが、紹介しきれないので割愛します
知りたい方は以下ドキュメントを参照してください

MDNのHTTP Cookieのドキュメント

参考:
【PHP超入門】Cookieとセッションについて
Cookieとセッションをちゃんと理解する
「Cookie」と「セッション」と「セッションCookie」の違い

#1.2 セッションとの違い
少し話は脱線しますが、一時的に情報を保存する技術ということで類似点があるセッションとの違いについても触れておきます。

大きな違いとしては2つあります。
保存先と有効期間です。
#1.2.1 保存先
先ほどCookie内の情報の保存先について、
Webサーバーが発行し、Webブラウザ上に保存されると書きましたが、
これに対してセッションは、Webサーバーに保存されます。
#1.2.2 有効期間
Cookieが情報を保持できる期間は任意で設定できるのに対し、
セッションはブラウザを閉じるまでしか保持できません。

参考:11.3 セッションの仕組みを理解しよう

#2 実際のCookieの使用方法
Cookieの概念を説明したところで、実際のコードの書き方を解説します。
(ここではPHPを使用して説明します)
##2.1 Cookieを保存する
Cookieを保存するにはsetcookie()を使用します。
setcookie(’キー’,’保存したい値’,’有効期限’)
第3引数を設定しないことも可能ですが、ブラウザを閉じると消えてしまいます。
(第4引数以降は省略します。知りたい方は下記のドキュメントを参照してください。)
参考:MDNのsetcookieのドキュメント

以下の例ではキーをanimal,保存したい値をpanda,有効期限を保存時から24時間(606024秒)後に設定しています。

<?php
//ここでCookieに情報を入れる
setcookie('animal','panda',time()+60*60*24);

//time関数 time()は現在時刻(単位/秒)を指します。
?>

//実際に動作させるのであれば、HTMLのコードはこの下に書きます。(省略)

このsetcookie()を動作させる順番は、必ず文字列が出力される前に動作させないといけません。
(エラーが出ます。)

#2.2 Cookieを呼び出す
Cookieを呼び出すには$_COOKIE[]を使用します。
$_COOKIE['キー']
引数でキーを指定することで、対応した保存した値を呼び出すことができます。
(先ほどの例で言うと、キーにanimalを指定するとpandaを呼び出すことができます。
先ほど保存したCookieを呼び出して、出力をしてみます。

入力

//HTMLは省略
<?php
//キー:animal 保存した値:panda
  echo 'Cookieの中身は:'.$_COOKIE['animal'].'です';
?>

出力

//キー:animal 保存した値:panda
Cookieの中身は:pandaです

#2.3 設定したCookieを確認する
設定したCookieを確認するには、各ブラウザの開発者ツールを使います。
ブラウザによって確認方法が違うので、下記リンクを参照してください。
主要ブラウザCookieの確認方法まとめ

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?