インターネット
下の動画はこの節の解説ではありません。 解説動画の雰囲気を知っていただくための見本として、「AI・機械学習」の動画を再生します。
この節の解説動画はプレミアム限定です。プレミアムなら全科目・全節が見放題!
プレミアムで見るHTTPは、要求と応答を1往復するだけの単純なプロトコルです。1回のやり取りが終われば、サーバは相手のことを忘れてしまいます。ところが実際のWebサイトでは、ログイン状態が保たれ、買い物カゴの中身が覚えられています。この「覚えている」を実現しているのがCookieです。そして、ページ全体を読み込み直さずに画面の一部だけを書き換える仕組みがAjaxです。どちらも、もともと単純だったWebを、使いやすいアプリケーションへ進化させた技術といえます。Cookieが保存される場所は、令和2年度の本試験でそのまま問われた論点です。
簡単にいうと
Cookieは「Webサイトが、あなたの端末に置いていく名札」!大事なのは、サーバ側ではなくクライアント側に保存されるということ。ここを取り違えると、そのまま失点につながるよ。
① Cookieとは
Cookieとは、Webサーバに対するアクセスがどの端末からのものであるかを識別するために、Webサーバの指示によってコンピュータ(クライアント側)にユーザ情報などを保存する仕組みです。
② 保存される場所が最重要
定義文の中でもっとも狙われるのが、「コンピュータ(クライアント側)に保存する」という部分です。
| 正しい | 誤り | |
|---|---|---|
| 保存される場所 | クライアント側(利用者の端末) | サーバ側 |
令和2年度の本試験では、「サーバ側に保存する仕組みである」と書き換えた選択肢が出題されました。クライアント側と確実に覚えてください。
③ 記録される内容
Cookieには、次のものを記録しておくことができます。
具体例
設例 Cookieが保存される場所
> 次の記述の正誤を判定せよ。(令和2年度第5問 改題)
> Cookieは、いつ、どのWebサイトを見たかといった履歴や、パスワードなどのログイン情報などをサーバ側に保存する仕組みである。
解答 ×
Cookieはクライアント側にユーザ情報などを保存する仕組みであるため、本肢の「サーバ側に保存する」という部分が誤りです。
この設問の作り
記録される内容(履歴、ログイン情報)は正しく書かれています。誤っているのは保存される場所だけです。
長い選択肢の中で、1か所だけが入れ替えられている——この科目で繰り返し見てきた作り方です。
対策
「Cookie=クライアント側」という1点を、真っ先に確認する習慣をつけてください。他がすべて正しくても、ここが「サーバ側」になっていれば誤りです。
自分のブラウザで確かめる
ブラウザの設定画面には、Cookieを確認したり削除したりする項目があります。そこには、

Cookieの仕組み
試験のポイント
簡単にいうと
Cookieは便利だけど、勝手に保存されるという性質がある。だからこそ「同意しますか」という確認が出るようになったんだ。便利さとプライバシーは、つねに表裏一体だよ。
① 主な用途
Cookieは、パスワードなどのログイン情報を保存することでユーザ認証を簡略化することや、オンラインショッピングの買い物カゴの状態などを管理することができます。
| 用途 | 内容 |
|---|---|
| ユーザ認証の簡略化 | パスワードなどのログイン情報を保存することで、毎回入力しなくて済む |
| 買い物カゴの状態管理 | 商品を選んでからページを移動しても、カゴの中身が保たれる |
簡単にいうと
地図をドラッグしても、ページ全体が読み込み直されないよね?あれがAjax! 画面の一部だけをこっそり書き換えているんだ。「非同期」という言葉がキーワードだよ。
① Ajax(Asynchronous JavaScript + XML)
Ajaxとは、JavaScriptの非同期通信を利用して、WebブラウザとWebサーバとの間で通信を行い、XML形式のデータをWebサーバとやり取りすることで、画面の一部を動的に再描写する仕組みです。
画面上でマウスカーソルを移動させることでその説明が個別に表示されるWebサイトやGoogleマップなど、幅広い用途で利用されています。
② 名前を分解する
| 部分 | 意味 |
|---|---|
| Asynchronous |
動画・テキスト・過去問・AI添削まですべて網羅!
予備校代の1/10以下で、独学の不安をまるごと解決できます
④ 発行と参照の流れ
| 順番 | 動き |
|---|---|
| ① | はじめての要求……ブラウザがWebサーバにアクセスする |
| ② | Cookieを発行する……Webサーバが専用のCookieデータを発行する |
| ③ | 応答……ブラウザは受け取ったCookieデータを保存する |
| ④ | 次回以降の要求……ブラウザは保存したCookieデータをWebサーバに提示する |
| ⑤ | Cookieを参照する……Webサーバは以前アクセスしてきたWebブラウザかどうかを特定する |
| ⑥ | 応答 |
【最初のアクセス】Webサーバにアクセスしたときに、専用のCookieデータが発行され、Webブラウザは受け取ったCookieデータを保存します。
【次回以降のアクセス】Webブラウザは受け取ったCookieデータをWebサーバに提示します。Webサーバでは以前アクセスしてきたWebブラウザかどうかを特定します。
⑤ なぜこんな仕組みが要るのか
第5節で学んだとおり、HTTPは要求と応答の1往復で完結します。サーバは、次に来た要求が同じ利用者のものか、別人のものかを、それだけでは判断できません。
| HTTPだけでは | Cookieがあれば |
|---|---|
| 毎回「はじめまして」の状態 | 前回の続きから始められる |
| ログインしても次のページで忘れられる | ログイン状態を保てる |
| 買い物カゴが1ページごとに空になる | カゴの中身を覚えていられる |
サーバが忘れてしまうなら、利用者側に覚えてもらえばよい——これがCookieの発想です。
⑥ 名前の由来
cookie は菓子のクッキーですが、この用法は「フォーチュンクッキー(中に紙片が入った菓子)」や、コンピュータ用語の「magic cookie(受け渡される小さなデータ)」に由来するとされています。
小さな情報のかけら、というイメージです。
⑦ 発行するのはサーバ、保存するのはクライアント
混乱しやすいので整理します。
| 動作 | 誰が行うか |
|---|---|
| Cookieを発行する | Webサーバ |
| Cookieを保存する | クライアント(ブラウザ) |
| Cookieを提示する | クライアント(ブラウザ) |
| Cookieを参照する | Webサーバ |
「Webサーバの指示によって、クライアント側に保存する」——定義文のこの一文に、両者の役割が凝縮されています。
といった情報が並んでいます。これらがすべて自分の端末に保存されていることが、実際に見れば分かります。
Cookieを削除するとどうなるか
| 起きること | 理由 |
|---|---|
| ログイン状態が解除される | ログイン情報のCookieが消えた |
| 買い物カゴが空になる | カゴの内容と結びつくCookieが消えた |
| 「はじめてのアクセス」として扱われる | サーバが以前の訪問と結びつけられない |
| 言語や表示設定が初期状態に戻る | 設定を覚えていたCookieが消えた |
「サーバ側に保存されている」なら、端末のCookieを消しても何も変わらないはずです。実際には上のようなことが起きるので、クライアント側に保存されていることが確認できます。
端末を変えるとどうなるか
| 場面 | 結果 |
|---|---|
| 同じサイトを別のパソコンで開く | ログインし直しになる |
| 同じサイトをスマートフォンで開く | 同上 |
Cookieはその端末のブラウザにしか保存されていないので、別の端末には引き継がれません。これも、保存場所がクライアント側であることの証拠です。
確認してみましょう
> 次の記述の正誤を判定せよ。
> a Cookieは、Webサーバの指示によってクライアント側にユーザ情報などを保存する仕組みである。
> b Cookieには、どのWebサイトを見たかといった履歴や、そのサイトの訪問回数を記録できる。
> c 最初のアクセス時にはクライアントがCookieを発行し、Webサーバがそれを保存する。
解答 a:○ b:○ c:×
オンラインショップで買い物をする場面を追ってみましょう。
| 順番 | 動き | Cookieがなければ |
|---|---|---|
| ① | 商品Aをカゴに入れる | — |
| ② | 別のページへ移動する | カゴの中身が失われる |
| ③ | 商品Bをカゴに入れる | 商品Aは消えている |
| ④ | 購入手続きへ進む | 商品Bしか入っていない |
HTTPは1往復で完結するため、ページを移動するたびに「別人」として扱われてしまいます。Cookieによって同じ利用者だと識別できるから、カゴの中身を保てるのです。
③ 勝手に保存されるという性質
Webサイトの提供者によって勝手にクライアントのコンピュータに保存されるため、Webサイトによっては、クライアントに選択させる場合もあります。
ここが、Cookieをめぐる論点の核心です。
| 性質 | 意味 |
|---|---|
| サイト側の指示で保存される | 利用者が意識しないまま保存される |
| 閲覧履歴を記録できる | どのページを見たかが記録される |
| 訪問回数を記録できる | いつ何回来たかが分かる |
④ 「同意しますか」という確認
Webサイトを開いたときに「Cookieの使用に同意しますか」という表示が出るのは、この「勝手に保存される」性質に対して、利用者の選択の機会を設けるためです。
定義文にある「Webサイトによっては、クライアントに選択させる場合もある」というのが、これにあたります。
⑤ プライバシーの観点
Cookieによって記録される情報を並べると、その意味が見えてきます。
| 記録できること | そこから分かること |
|---|---|
| どのWebサイトを見たか | 関心のある分野 |
| 最後に訪れた日時 | 行動の時間帯 |
| 訪問回数 | 関心の強さ |
| 買い物カゴの内容 | 購買意欲のある商品 |
これらを組み合わせると、利用者の関心や行動パターンが浮かび上がります。第13章で学ぶデジタルマーケティングでは、こうした情報が広告の配信に使われています。
⑥ 便利さとリスクは同じところから来る
| 便利な点 | 裏返しのリスク |
|---|---|
| ログインし直さなくてよい | 端末を他人が使えば、そのままログインできてしまう |
| 前回の続きから使える | 行動が記録されている |
| 自分に合った情報が出る | 関心が推測されている |
同じ仕組みが、便利さとリスクの両方を生んでいる——この構図は、情報システムのあらゆる場面に現れます。
⑦ 実務上の注意点
共有のパソコンでの利用
| 場面 | 起きうること |
|---|---|
| ネットカフェや共有端末でログインする | Cookieが残り、次の利用者がそのままログインできる |
| 対策 | ログアウトする、プライベートモードを使う、Cookieを削除する |
ログアウトは、単に画面が変わるだけの操作ではありません。サーバ側でその接続を無効にし、Cookieを使えなくする操作です。だからログアウトせずにブラウザを閉じるだけでは、危険が残ります。
企業サイトを運営する側として
| 論点 | 検討すべきこと |
|---|---|
| Cookieの利用について明示しているか | プライバシーポリシーへの記載 |
| 利用者の同意を得ているか | 同意の取得方法 |
| どこまでの情報を記録しているか | 必要な範囲にとどめる |
| 第三者に提供していないか | 広告配信などで外部に渡っていないか |
個人情報保護法との関係
Cookie単体は氏名や住所を含まないことが多いのですが、他の情報と組み合わせれば個人を特定できる場合があります。経営法務で学ぶ個人情報保護法の観点からも、Cookieの取り扱いは慎重に検討すべき論点とされています。
診断士として企業のWebサイト運営に助言する際には、「便利だから使う」で済ませず、利用者への説明と同意の取得まで含めて考えるよう促すことが求められます。
具体例
ログイン状態はどうやって保たれているか
会員制のサイトにログインしてから、ログアウトするまでを追ってみましょう。
| 順番 | 動き | Cookieの役割 |
|---|---|---|
| ① | IDとパスワードを入力する | — |
| ② | サーバが本人確認を行う | — |
| ③ | サーバがCookieを発行する | 「この人はログイン済み」という印 |
| ④ | ブラウザがCookieを保存する | — |
| ⑤ | 別のページへ移動する | ブラウザがCookieを提示する |
| ⑥ | サーバが「ログイン済みの人だ」と判断する | Cookieを参照 |
| ⑦ | 会員向けのページが表示される | — |
| ⑧ | ログアウトする | Cookieが無効になる |
⑤〜⑦が毎ページ繰り返されている
ページを開くたびに、ブラウザはCookieを提示し、サーバはそれを確認しています。利用者には見えませんが、1クリックごとにこのやり取りが行われています。
Cookieが盗まれるとどうなるか
セッションハイジャックという攻撃があります。
| 攻撃 | 何が起きるか |
|---|---|
| Cookieを盗み取る | パスワードを知らなくても、ログイン状態を乗っ取れる |
パスワードが漏れていなくても、Cookieが漏れれば乗っ取られる——これがCookieを使うことのリスクです。
対策
| 対策 | 効果 |
|---|---|
| HTTPSを使う | 通信経路でCookieを盗まれないようにする |
| Cookieに有効期限を設ける | 古いCookieを使えなくする |
| ログアウト時にCookieを無効化する | 残っていても使えないようにする |
1つ目が基本です。HTTPの通信は暗号化されていないため、同じネットワーク上の第三者にCookieを読み取られる危険があります。第4章で学んだ公衆無線LANの危険性は、ここにもつながっています。
現在ほとんどのサイトがHTTPSになっている理由の1つが、この対策です。
中小企業のWebサイトへの助言
| 確認すること | なぜ必要か |
|---|---|
| HTTPSに対応しているか | Cookieや入力情報を保護するため |
| ログイン機能があるか | あればCookieの保護が必須 |
| Cookieの利用を明示しているか | 利用者への説明責任 |
| 広告タグを入れていないか | 第三者にデータが渡る可能性 |
4つ目が見落とされやすい
アクセス解析や広告のタグをWebサイトに貼ると、その事業者のCookieも保存されます。自社が記録していなくても、第三者が利用者の行動を記録している状態になります。
この点は、プライバシーポリシーに記載すべき事項として整理しておく必要があります。
確認してみましょう
> 次の記述の正誤を判定せよ。
> a Cookieは、ログイン情報を保存することでユーザ認証を簡略化できる。
> b Cookieはオンラインショッピングの買い物カゴの状態などを管理できる。
> c Cookieは利用者が明示的に保存を指示した場合にのみ保存される。
解答 a:○ b:○ c:×

Cookieの用途とプライバシー(1/2)

Cookieの用途とプライバシー(2/2)
試験のポイント
| JavaScript | ブラウザ上で動くスクリプト言語(第8章で学びます) |
| XML | データの記述形式(第2章・第8章で学びます) |
名前がそのまま構成要素を表しています。
③ 「非同期」とは何か
同期通信と非同期通信の違いが、この論点の核心です。
| 同期通信(従来のWeb) | 非同期通信(Ajax) | |
|---|---|---|
| サーバに問い合わせる間 | 待たされる | 他の操作ができる |
| 画面の更新 | ページ全体を読み込み直す | 必要な部分だけ書き換える |
| 見え方 | 画面が真っ白になって再表示される | なめらかに変わる |
④ 従来のWebで何が起きていたか
| 順番 | 動き |
|---|---|
| ① | 利用者がボタンを押す |
| ② | ブラウザがサーバに要求を送る |
| ③ | 利用者は待つ(この間、画面は操作できない) |
| ④ | サーバがページ全体を返す |
| ⑤ | 画面全体が描き直される |
わずかな変更でも、ページ全体を作り直していたわけです。
⑤ Ajaxでは何が変わるか
| 順番 | 動き |
|---|---|
| ① | 利用者が操作する |
| ② | JavaScriptが裏でサーバに問い合わせる |
| ③ | 利用者は待たされず、操作を続けられる |
| ④ | サーバが必要なデータだけを返す |
| ⑤ | 画面の一部だけが書き換わる |
③と⑤が決定的な違いです。待たされず、全体が描き直されない。この2点によって、Webページがアプリケーションのようになめらかに動くようになりました。
⑥ 地図サービスで実感する
Googleマップのような地図サービスは、Ajaxの効果がもっとも分かりやすい例です。
| 操作 | 従来のWebなら | Ajaxでは |
|---|---|---|
| 地図をドラッグする | 1回ごとにページ全体を読み込み直す | 必要な範囲の地図だけを取得して継ぎ足す |
| 拡大縮小する | 同上 | 同上 |
| 検索する | ページが切り替わる | 地図はそのままで、結果だけ表示される |
地図を少し動かすたびに画面が真っ白になっていたら、とても使えたものではありません。Ajaxがあって初めて、地図サービスは実用になりました。
⑦ 他の用途
| 用途 | 動き |
|---|---|
| マウスカーソルを合わせると説明が出る | その時点で説明データを取得する |
| 入力中に候補が表示される | 入力のたびに候補を問い合わせる |
| ページを下にたどると次が読み込まれる | 末尾に近づいたら追加で取得する |
| 更新ボタンを押さずに新着が表示される | 定期的に裏で問い合わせる |
いずれも「ページ全体を読み込み直さずに、必要な部分だけを更新する」という点で共通しています。
⑧ Webアプリケーションへの道
Ajaxの登場によって、Webサイトは閲覧するものから操作するものへと性格を変えました。
| 時期 | Webの性格 |
|---|---|
| 初期 | 文書を読む(ハイパーテキスト) |
| 中期 | フォームで入力し、送信する |
| Ajax以降 | アプリケーションのように操作する |
現在、表計算やワープロまでブラウザ上で動くようになっていますが、その出発点にあるのがAjaxです。第7章で学ぶWebアプリケーションや、第12章のSaaS(ソフトウェアをサービスとして提供する形態)は、この流れの延長線上にあります。
⑨ XMLについて
名前に含まれるXMLは、データを記述する形式です。第3章で学んだ半構造化データの代表例で、タグによって意味を明示できます。
ただし現在では、XMLよりJSONを使うことのほうが多くなっています。JSONのほうが記述が簡潔で、JavaScriptとの相性がよいためです。名前は「Ajax」のままですが、実際に使われるデータ形式は変わってきている、という点も知っておくとよいでしょう。
具体例
設例 Ajaxの定義
> 次の記述の正誤を判定せよ。(令和元年度第3問)
> Ajaxは、WebブラウザのJavaScriptのHTTP通信機能を利用して、対話型のWebアプリケーションを構築する仕組みである。
解答 ○
「対話型のWebアプリケーション」という表現が、Ajaxの本質を言い当てています。
「対話型」とは何か
| 一方通行 | 対話型 |
|---|---|
| 要求を送り、結果を受け取って終わり | 操作するたびに反応が返り、やり取りが続く |
| ページを読む | アプリケーションを使う |
人と会話するように、操作と反応が続いていく——これが対話型です。Ajaxは、この体験をWeb上で実現しました。
社内システムをWebで作るかどうか
業務システムを新しく作る場面で、Webアプリケーションにするかどうかを検討します。
Webアプリケーションの利点
| 利点 | 内容 |
|---|---|
| 端末にインストールが不要 | ブラウザがあれば使える |
| 更新が1か所で済む | サーバ側を更新すれば全員に反映される |
| どの端末からでも使える | パソコン、タブレット、スマートフォン |
| 外出先からも使える | VPNと組み合わせれば社外からも |
かつての課題と、Ajaxによる解決
| かつての課題 | Ajaxによる改善 |
|---|---|
| 操作のたびに画面が切り替わって使いにくい | 必要な部分だけ更新される |
| 入力中の内容が消える | ページを読み込み直さないので消えない |
| 専用ソフトに比べて操作感が劣る | アプリケーションに近い操作感 |
業務システムがWebに移った理由
2000年代以降、業務システムの多くが専用ソフトからWebアプリケーションへ移行しました。その背景には、
1. 配布と更新の手間がなくなる(管理者にとっての利点)
2. どこからでも使える(利用者にとっての利点)
3. Ajaxによって操作感が改善した(移行の障害が取り除かれた)
という3つの要因があります。3つ目がなければ、1と2の利点があっても移行は進まなかったでしょう。
中小企業への助言として
| 検討事項 | 確認すること |
|---|---|
| 既存の専用ソフトを使い続けるか | 更新の手間、端末の制約 |
| Webアプリケーションに移行するか | 操作感が業務に耐えるか |
| クラウドのサービスを使うか | 第12章で学ぶSaaSの検討 |
「Webだから使いにくい」は、もはや当たらない——この認識を持っておくことが、選択肢を狭めないために重要です。
確認してみましょう
> 次の記述の正誤を判定せよ。
> a Ajaxは、JavaScriptの非同期通信を利用して画面の一部を動的に再描写する仕組みである。
> b Ajaxでは、画面を更新するたびにページ全体を読み込み直す必要がある。
> c Ajaxは、Googleマップなど幅広い用途で利用されている。
解答 a:○ b:× c:○

Ajax
試験のポイント
プレミアムプラン
¥9,800〜/ 買い切り・自動更新なし(税込)
決済はStripe(世界最高水準・PCI-DSS準拠)で安全に処理されます。カード情報は当サービスに保存されません。