ネットワークの基本2〜プロトコル/NAT/HTTP通信の中身

ネットワークの基本について学ぶ 第2回 プロトコル/NAT/HTTP通信の中身 2017/9/28 佐々木 健

この文書について 前回の勉強会で沢山お菓子をもらえて嬉しかったの ですが、沢山のお菓子がいつの間にか減ってきた ので、また勉強会をやる気になりました。 前回質問を受けたことに関して説明をする、という 内容になっています。

お願い 定時後の勉強会なので気楽に行きましょう。 飲食、雑談は自由にしてください。 みんなであれこれ雑談してくれるほうが私もおやつ を食べやすいです。 わからないことがあったら遠慮せずに聞いてね。 #beginner-net-study というSlackチャンネルを 作ったので雑談に使ってくださいませ。

本日のタイムスケジュール(予定) ● 参加者の自己紹介(5分) – 人数が少なかったら全員 – 人数が多かったら近くにいる5人に自己紹介 ● 前回のおさらい(5分) ● 本編(15分) ● 質疑(5分)

自己紹介タイム ● 参加者の自己紹介(5分) – 人数が少なかったら全員 – 人数が多かったら近くにいる5人に自己紹介 ● 前回のおさらい(5分) ● 本編(15分) ● 質疑(10分)

前回のおさらい 説明したこと、疑問点のまとめ

パケット通信とは何か？ 郵便でデータを運ぶイメージ 封筒には、 宛先、差出元が書いてある

インターネットの基本アイディア ● データをパケット通信で送る ● パケットには宛先と差出元を書いておく ● ● パケットを受けとった人は各自が適切に判断して 処理をする 宛先、差出元はユニーク(世界でひとつだけ)

疑問点1 ● 宛先、差出元はユニーク(世界でひとつだけ) 具体的には 何が書いてあるの？ いろいろなところで、同じIPアドレス を使ってる気がするけど、、、、 192.168.xxx.xxx とか

RFC:791 INTERNET PROTOCOL 0 1 2 3 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ |Version| IHL |Type of Service| Total Length | +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ | Identification |Flags| Fragment Offset ??? | +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ | Time to Live | Protocol | Header Checksum | +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ | Source Address 差出元 | +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ | Destination Address | +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ | Options | Padding | +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+ Example Internet Datagram Header 宛先

今日のお題1 プロトコルって何？

そもそも通信とは何か？ ● オブジェクトとオブジェクトが協調動作を行なうための 手段 ● 情報をやりとりする ● なにかを媒体としてやりとりする ● なんらかの目的があって行なわれる ● 決まった手順、約束事に従って行なわれる

そもそも通信とは何か？ ● オブジェクトとオブジェクトが協調動作を行なうための 手段 ● 情報をやりとりする ● なにかを媒体としてやりとりする ● なんらかの目的があって行なわれる ● 決まった手順、約束事に従って行なわれる プロトコル

(例)ハンバーガーを買いに行こう!! いらっしゃいませ ご注文は何になさいますか？ ビッグマックセットで お飲み物は何になさいますか？ オレンジジュース 600円にいただきます。 スイカで払います ありがとうございました

(例)ハンバーガーを買いに行こう!! 目的: ハンバーガーや飲み物を買いたい、売りたい やりとりするもの: 買うもの、値段 媒体: 日本語、音声、空気 手順、約束事: 接客マニュアル、商品メニュー、 日本円決済、電子決済

通信条件が合わないと通信できない いらっしゃいませ ご注文は何になさいますか？ (私、セルクナム族!!) (日本語良くわからない!!) ..........

プロトコルの階層構造 ハンバーガーの注文 日本の社会常識 日本語 通信を正しく行なうためには、 その通信を支えるプロトコルを お互いに理解している必要がある

インターネットプロトコルの階層構造 HTTP TCP IP Ethernet Webを実現するためのHTTPの下には、 TCP、IP、Ethernet等の下位プロトコルがある

インターネットプロトコルの階層構造 HTTP TCP IP Ethernet 前回説明したところ

今日のお題2 NATの仕組み

インターネットの基本アイディア ● データをパケット通信で送る ● パケットには宛先と差出元を書いておく ● ● パケットを受けとった人は各自が適切に判断して 処理をする 宛先、差出元はユニーク(世界でひとつだけ)

具体的なパケットのイメージ 送信元IPアドレス src IP 宛先IPアドレス dest IP データ

1990年代 ● 宛先、差出元はユニーク(世界でひとつだけ) ● アドレスの数足りなくね？？ ● IPv6でアドレスの数を増やす ● NAT技術で延命？

プライベートIPアドレス ● プライベートネットワーク（外部から利用できな い社内LANなど）のアドレスとして使うことがで きる。 – 10.0.0.0〜10.255.255.255 – 172.16.0.0〜172.31.255.255 – 192.168.0.0〜192.168.255.255

NATの考え方 ● ● ● 自分達の組織の中はプライベートアドレスを使 う。 外と通信するときだけグローバルアドレス(ユ ニークに割り当てられたIPアドレス)を使う。 プライベートネットワークとグローバルネットワー クの繋ぎ目にはルータを配置し、そこでアドレス の変換を行なう。

良くある構成 クライアントPC IPアドレス 192.168.0.10 ルータ IPアドレス IPアドレス 192.168.0.1 198.51.100.1 ウェブサーバ IPアドレス 203.0.113.1 ※ルータは複数のIPアドレスを持っている クライアントPCからウェブサーバへの通信を考える

インターネットの基本アイディア(再掲) ● データをパケット通信で送る ● パケットには宛先と差出元を書いておく ● ● パケットを受けとった人は各自が適切に判断して 処理をする 宛先、差出元はユニーク(世界でひとつだけ)

1.クライアントPCから送信 192.168.0.10 203.0.113.1 data IPアドレス 192.168.0.10 IPアドレス IPアドレス 192.168.0.1 198.51.100.1 IPアドレス 203.0.113.1

2.ルータが変換テーブルに記録 192.168.0.10 203.0.113.1 data IPアドレス 192.168.0.10 IPアドレス IPアドレス 192.168.0.1 198.51.100.1 192.168.0.10 203.0.113.1 IPアドレス 203.0.113.1

3.ルータがアドレスを書き換えて送信 192.51.100.1 203.0.113.1 data IPアドレス 192.168.0.10 IPアドレス IPアドレス 192.168.0.1 198.51.100.1 192.168.0.10 203.0.113.1 IPアドレス 203.0.113.1

4.サーバから返信(送信) 203.0.113.1 192.51.100.1 data IPアドレス 192.168.0.10 IPアドレス IPアドレス 192.168.0.1 198.51.100.1 192.168.0.10 203.0.113.1 IPアドレス 203.0.113.1

5.変換テーブルと付き合わせ 203.0.113.1 192.51.100.1 data IPアドレス 192.168.0.10 IPアドレス IPアドレス 192.168.0.1 198.51.100.1 192.168.0.10 203.0.113.1 IPアドレス 203.0.113.1

6.ルータがアドレスを書き換えて送信 203.0.113.1 192.168.0.10 data IPアドレス 192.168.0.10 IPアドレス IPアドレス 192.168.0.1 198.51.100.1 192.168.0.10 203.0.113.1 IPアドレス 203.0.113.1

実際に使われてるNAT ● ● ● この資料で説明した、IPアドレスだけを変換す る、原始的なNAT(Network Address Translation)は現在はほとんど使われていない。 IPアドレスに加えて、ポート番号の変換を行な う、NAPT(Network Address Port Transation) を使うのが普通。今では、NATと言えばNAPTの ことを指すのが一般的。 NAPTの説明は、ポート番号について説明してか らのほうが良いかな。

今日のお題3 HTTP通信を見てみよう Webの裏側を覗いてみる

Google Chrome の Developer Tools F12 を押す!!

F12を押すとこうなる Developer Tools(DevTools)

Webの中身がいろいろ見れる

今回は通信を見てみる Networkを押す

DMMを見てみよう URLを入力

どどどどっと出力される!!

Webページの表示の仕方 ● ● ● ブラウザからウェブサーバにHTMLを取りにいく 取ってきたHTML情報を元に、さらに必要なデー タをウェブサーバに取りにいく 取ってきたデータを全部組み合わせて表示する 1ページを表示するだけでも、 沢山の通信が発生する

表示エリアの説明 全ての通信の様子 横軸は時間 並列で複数の通信がされている

表示エリアの説明 1つ1つの通信の羅列 ウェブの構成要素毎に通信が 行なわれていることがわかる クリックすることで各通信の 詳細を確認できる

Web通信プロトコル、HTTPの概要 こういう情報ください こういう情報あげるよ

Web通信プロトコル、HTTPの概要 Request Header こういう情報ください こういう情報あげるよ Respons Header + データ本体

Request/Response Headerを見よう DevToolsで 要素を選択して Headersを押す

どのぐらい時間がかかっているか Timingを選べばわかる

ゴチャゴチャしてきたら Clearすれば消えます

インターネットプロトコルの階層構造 HTTP TCP IP Ethernet Chrome WebToolsで見ることができるのは HTTPだけ

インターネットプロトコルの階層構造 HTTP TCP IP Ethernet 全部見るツールもある ↓ Wireshark等

Wiresharkのデモ

質疑応答

拾った疑問への回答1 ● ● 講義資料のイラストが手紙っぽい感じだったからボンヤリとEmail の話なのかと感じていたけど、多分違う。 – うん、違う。 – メールは、SMTP等のメール用のプロトコルについて調べると良いんだけ どいろいろと複雑なので、まったくもってもはや初心者向き教材にはなら ないですw 差出人の情報はあまり要らないってコトだったけど、何かを送るっ てことは、送りっぱなしじゃなくてレスポンス欲しいことが多くな い？なのに不要？ – まったくその通りです。 – レスポンス用に使います。 – 不要ってのは言い過ぎでしたね。

拾った疑問への回答2 ● パケットを「送る」ことばっかり考えていたけど、 「受取る」こともあるよね？具体的に何を行うの が「送る」で、何が「受取る」なのかな？ – 送信側はパケットを作って送る – パケットを受けとったら適切に判断して処理する – 実際の通信においては、双方でパケットを送信しあっ て、双方で受けとって、うまいことやる感じです。