Webアプリケーションに関する勉強記録①

2021-05-27T22:50:56+09:00

最近Webアプリケーション作成に興味を持ちましたが、知識が足りないと痛感しました…

そのため、この
伸び悩んでいる3年目Webエンジニアのための、Python Webアプリケーション自作入門
を読み、Webアプリケーションとはどういうものなのかを理解していけたらと思います。
私は3年目でもなければWebエンジニアでもないのですが、とてもわかりやすく楽しい内容だと思うので、興味のある方はこの本を読んでみてください。

本記事は、Chapter1～Chapter8の内容について、自分用のまとめとして作成しています。

乱暴にかみ砕くとこのように言えます。Webサービスというのはブラウザを介して利用するサービスのことで、GmailやGithubなど普段私たちがブラウザ上で利用しているもののことです。このWebサービスは、プログラミンした文字列ではなく、それらを解釈して実行した結果実現される機能群です。なので、このWebアプリケーションのソースコードを書き、あるプログラムで実行することで、Webサービスが私たちに提供されています。

以下の画像がWebアプリケーションの概要図になります。ブラウザがWebサーバーへ何かリクエストを送信すると、Webサーバーは、Webフレームワークを介してサービスごとに固有のプログラムをブラウザに返してくれます。このWebサーバー＋Webフレームワーク+サービスごとに固有のライブラリをまとめてWebアプリケーションと呼ぶことができます。

Webサーバとはなにか

Webサーバーとは、Webサービスを提供するプログラムと考えていいです。ここで、Webアプリケーションもそうだったじゃないかと思いますよね。実は広義の意味ではこの二つは同じ意味なのですが、多くの場合、WebサーバーはWebアプリケーションの中でも特にWebサービスを提供する窓口部分のプログラムのことだけを指します。

Webサービスはかつては単一のプログラムで提供されており、それをWebサーバーと呼んでいました。しかし、提供するサービスがとても多くなり、よりリッチなサービスとなったため、どんなWebサービスでも使用する共通部分は共通プログラムとして、サービスごとのプログラムと分けて作成するようになりました。その結果、この共通プログラム部分がWebサーバーと呼ばれるものになってきました。

Webサーバーの代表例として、apacheやnginxがあります。

Webフレームワークについて

先ほどのサービスごとのプログラムの中にも、定番の共通機能がよく見られ、それらがライブラリとして世の中に出回っていきました。それがWebフレームワークと呼ばれるものです。
Webサーバー上で追加で動かすような構成になっており、PythonのDjangoや、Laravelなどがあります。

Webサーバ以外のサーバ

Webサーバは別名HTTPサーバと呼ばれ、クライアントとHTTPというプロトコルで通信します。他にも様々なサーバが存在し、それぞれプロトコルの違いにより区別されています。

DBサーバ：RDBMSなど、データを格納し走査するためのサーバ
ファイルサーバ：主に企業等で用いられる、メンバーがLANの中で自由にファイルを保存し、共有できる仕組みに使用されるサーバコンピュータ
メールサーバ：メールの送信・受信の役割を持つサーバ

通信プロトコルについて

通信プロトコルとは、通信する際の規格のことです。この取り決めを守ることで、メーカー、機種などに左右されずに、全てのパソコンやサーバ間で通信を行うことができます。データの通信ではパケット交換方式が用いられています。これは、通信データをパケットと言われる単位に分割し送ることで、多くのユーザが同時にデータを送受信することを可能にしています。パケットは、ヘッダという通信先や通信元の情報と分割されたデータによって構成されています。

HTTP：ブラウザとWebサーバが通信する際に使われるプロトコル
SMTP/POP/IMAP：メールの送受信委関するプロトコル。SMTPはメールの送信、POPはメールサーバから電子メールを受信する際に、IMAPはメールをサーバ上で保持し続ける際に使用するプロトコル。
FTP：クライアントとサーバ間のファイル転送の際に使用されるプロトコル

簡易Webサーバーを作る手順

実際にWebサーバとブラウザが通信しているところを確認し、真似することで簡易的なWebサーバを作ります。

STEP1:ChromeとApacheで通信してみる

ブラウザとWebサーバーが「通信する」とは

ChromeとApacheの通信、つまり、ブラウザとWebサーバの通信というのは、ブラウザからWebサーバに向かってリクエスト(Webサービスを提供してほしい)を送り、Webサーバがそれに対してレスポンス(Webサービス)を返すということです。

ブラウザからWebサーバーへリクエストを送るためには

インターネット上で、あるプログラムが別のプログラムへ何かを送るとき、必要となるのは宛先と内容です。
このうち、Chromeでは、宛先だけをURLバーに入力すれば、内容は自動で生成されます。

ここで、Webサービスにおける宛先のことを、URLと呼び、以下のような形式で表現されます。

URL = ** : // : / ?**

protocol

リクエストの送り方を指定する。Webサービスではhttpやhttpsがよく用いられる。郵便に例えると、「普通郵便」や「本人限定受取」といった郵便の送り方のようなものです。このように、宛先や内容には関係ないですが、送る手順や受け取り方がprotocolごとに変わります。

httpではいわば普通郵便で、送りたい内容をそのまま送ります。
httpsは暗号化通信で、httpよりセキュアな通信が可能となります。

host

送り先のWebサーバープログラムが動いているマシン(=コンピュータ)のインターネット上の住所を示します。基本的には、インターネット上のマシンを特定するためにIPアドレスを使用する。

IPアドレス以外にhostに使用できるものとして以下のものがあります。

DNSに登録されたドメイン:zenn.dev　google.comなど
localhost：IPアドレス127.0.0.1とみなされ、自分のＰＣを指す。

ただ、自分のPC上には様々なプログラムが動いており、hostだけでは宛先として不十分となります。例えば、マンションで、住所だけがわかっても部屋の番号がわからないような状態といえます。そこで、必要になるのがportです。

port

portは、インターネット通信の際に特定のマシンの中で動いている複数のプログラムから、目的のプログラムを特定するための番号。通常、ＰＣやサーバー上では複数のプログラムが動いているため、ポート番号を指定することで、同一IPのプログラムの中から、任意のプログラムへリクエストを送ることができる。

port番号は、プログラム起動時にプログラムが0～65535番の中から自分で設定することができる。

Well-Known ports : 複数のプログラムが同じportを番号を使うことはできず、後からそのport番号を割り振ろうとしたほうがエラーとなってしまいます。そのため、どのマシンでもよく使うようなプログラムには予めport番号が予約されており、このport番号のことをwell-known portsという。0～1023番まではすでに決まっている。例えば、HTTPは80番、HTTPSは443番、FTPは20・21番など。ただし、必ずしもwell-known portsでサービスを動作させる必要はなく、ソフトウェアによって設定できるようになっていることが多いです。

多くのブラウザでは、http通信する際は、デフォルトで80番ポートへ向けて通信すると決まっているため、httpでポートが80番の場合に限り、port番号を省略し、http://localhost/~と書いてもいいです。

UDP : コネクションレス型通信(通信開始前に相手との間で事前のやり取りをしない)。通信の信頼性(データの漏れや、順序が守られているかどうか)は高くないが、高速でリアルタイムの通信を行えます。
TCP : コネクション型通信(3 wayハンドシェイク)。通信の信頼性が高いです

TCPのコネクションは、3wayハンドシェイクと呼ばれる方法で結ぶ、通信相手との仮想の通信路のことをいいます。

「Webアプリ」の記事 - Crieit

Webアプリケーションに関する勉強記録①

Webアプリケーションとはなにか

Webアプリケーションについて

Webサーバとはなにか

Webフレームワークについて

Webサーバ以外のサーバ

通信プロトコルについて

簡易Webサーバーを作る手順

STEP1:ChromeとApacheで通信してみる

ブラウザとWebサーバーが「通信する」とは

ブラウザからWebサーバーへリクエストを送るためには

protocol

host

port

path

query

STEP2:ブラウザと自作サーバーで通信してみる

TCPサーバー

STEP3:自作クライアントとApacheで通信してみる

STEP4:自作サーバーを進化させる