👻

Webアクセスの仕組み　URLの中身とHTTPメソッドを知る

2023/07/08に公開

Web

今回は、Webアクセスの仕組みを簡単に解説します。

普段なんとなく行っている『Webアクセス』の仕組みを簡単に解説しました。
URLやHTTPメソッドなど、普段意識せず使用している物一つ一つの意味を知ることで
これからAPIを作成するときなどに大きく役立つと思います。
今回は、学習・復習者が対象なので、サラッと読んで理解できるように作成しました。

✅今回の内容

Webアクセスの仕組みを図解
URLの仕組み
HTTPリクエスト：URLとメソッド

✅メイン内容

🛠　Webアクセスの仕組みを図解

1. Webアクセスとは

Webアクセスとは、Webブラウザから任意のWebサイトにアクセスする事です。

普段、Google ChromeやSafariなどで検索し、
任意のページをクリックするとWebサイトが表示されます。

しかし、なぜページをクリックするとWebサイトが表示されるのでしょうか。

今回は、その仕組みについて簡単に解説していきます。

2. アクセスしてから画面が表示されるまでの流れ

ここでは、下記の図をもとにアクセスしてから画面が表示されるまでの流れを説明します。

①：URLを入力

検索エンジンからWebページを検索して、任意のページをクリックすると、
アドレスバーにURLが入力されます。

このアドレスバーのURLを使用してアクセス先Webサーバーの場所を特定します。

②：HTTPリクエストの送信

次に、アドレスバーのURLを基にWebブラウザからWebサーバーへHTTPリクエストを送信します。
HTTPリクエストの内容についてはこの後解説します。

イメージとしては、WebブラウザがWebサーバーに
「画面に表示するコンテンツをください。」と言っているような感じです。

③：HTTPレスポンスの送信

その後、WebサーバーはWebブラウザからのHTTPリクエストを解析し、
その結果（HTTPレスポンス）を送信します。

イメージとしては、WebサーバーがWebブラウザに
「これが画面に表示するコンテンツだよ」と言っているような感じです。

④：HTMLを表示

最後に、WebブラウザでWebサーバーから受け取ったHTMLを画面に表示します。

流れとしては、こんな感じになります。🍎

以降は『URLの中身』と『HTTPリクエストの中身』になります。
Webアクセスの仕組みをザッと理解するだけであれば、
ここでブラウザバックして大丈夫だと思います。

🛠　URLの仕組み

1. URLの構成

https://www.sample.co.jp/car/toyota

よく見るURLの例を出してみました。
部分ごとの名前をまとめておきます。

https：プロトコル
www：ホスト名
.sample：サードレベルドメイン
.co：セカンドレベルドメイン
.jp：トップレベルドメイン
car：ディレクトリ名
toyota：ファイル名

各部分の役割については、以下の記事でまとめているので
こちらを参考にしていただければと思います。

URLは一定の箇所でまとめて表現される事があるので、そちらの名前も書いておきました。

https://：スキーム
www.sample.co.jp：ホスト部
/car/toyota：パス

HTTPリクエストについては、以降で解説します。

🛠　HTTPリクエスト：URLとメソッド

1. おさらい

https://www.sample.co.jp/car/toyota

https://：スキーム
www.sample.co.jp：ホスト部
/car/toyota：パス

２. 役割を解説

上記記事で解説しているので、コンパクトに一文でまとめます。

スキーム

アクセスするプロトコルを指定する
ホスト部

アクセスするホスト名を指定する
パス

Webブラウザで表示されるファイルのパス

３. メソッド

URL（スキーム＋ホスト部＋パス）で表示するファイルを指定する事ができたので、
次にそのファイルを何するか指定してあげます。

その指示を出すのがメソッドです。

メソッドの種類	説明
GET	データを取得することをWebサーバに要求
HEAD	データそのものは要求せず、メッセージヘッダだけを取得することをWebサーバに要求
POST	Webサーバに、データを送信
PUT	Webサーバに、ファイルをアップロード
DELETE	Webサーバ上にあるデータを削除することを要求
CONNECT	例えばプロキシサーバなどに、トンネルの確立を要求

今回の例のように、
WebブラウザからアクセスしてWebページを表示するときはGETメソッドを使用します。

流れは以下のようになります。

WebブラウザでURLを入力する
WebブラウザからWebサーバーへHTTPリクエスト（GET）を送信する
　Webブラウザ：「画面に表示するコンテンツをください」
WebサーバーでHTTPリクエストの解析
　『どんな要求が来たのか』を分析してレスポンス内容を確定させる
　Webサーバー：「このファイルをGETしたいのね」
WebサーバーからWebブラウザへHTTPレスポンスを送信する
　Webサーバー：「これが画面に表示するコンテンツだよ」
WebブラウザでHTMLの表示

といった流れで、Webページは表示されます。🍎

✅まとめ

如何だったでしょうか。

今回は、Webアクセスの仕組みを簡単に解説しました。
普段、なんとなく使っている機能も調べてみると奥深くて面白いですね。

今回は、簡単にまとめたので深くは語っていませんが、Web業界は色々あってかなり面白いので、
今後も調査を進めていきたいです。

今回はここまで 