Web3層アーキテクチャー

一般的なWebシステム

クライアント・サーバ方式

レスポンス(様々な処理)↓

プレゼンテーション層

HTTPリクエストでクラアントとのやり取り、アプリケーション層の呼び出し

Apache

  • Webサーバーソフトウェア
  • モジュール単位でApacheに機能を追加削除できる

アプリケーション層

中心的なシステムの処理

データ層

データベース

ステータスコード

メソッド説明
200リクエスト成功
301リダイレクトリソースが恒久的に異動
307リソースが一時的に異動
400クライアントエラー不正なリクエスト
401承認が必要
403アクセスが禁止されている、アクセス券が必要
404リソースが見つからない
500サーバエラーサーバ内部エラー
503サービスが一時的に利用不可

HTTPリクエスト

メソッド説明
GETサーバにページの取得をリクエスト

URLにパラメータが表示
HEADサーバにヘッダのみの取得をリクエスト
POSTサーバにデータを送信

パラメータはボディに書かれる → 大きい重要なデータ
PUTファイルの保存をリクエスト
DELETEファイルの削除を要求
OPTIONSサーバの調査
CONNECTトンネルを開く
TRACEネットワーク経路の調査

ヘッダフィールド

  • ヘッダーフィールドは0行の場合あり
Accept受け入れ可能なメディア
(text/html、text/plain、application/json)
Accept-Languageブラウザが受け入れ可能な言語
Authorization認証情報(ユーザ名、パス)
Cache-Controlキャッシュを制御する指示情報
Content-Languageコンテントの言語コード
Content-TypeコンテンツのMINEタイプ、エンコーディング、
メッセージボディのメディア型
Cookieブラウザが保持するCookieの内容
Expiresコンテンツの有効期限
Last-Modifiedリソース・コンテンツの最終更新時刻、Date値
Refererリンク下のリソースのURL
Set-Cookieサーバが生成するCookieの内容
User-Agentクライアントの識別情報、名前

URL

https://ntorelabo.com/2023/03/17/%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0/#co-index-2

スキーマ//ホスト名:ポート番号/ディレクトリ/ファイル名?パラメータ(クエリ文字列)#フラグメント

オリジン … スキーマ//ホスト名:ポート番号

キャッシュ

  • 一時的に保存
  • 表示速度の上昇
キャッシュCookie
テキスト、画像などのWebページの情報を保存ID、パスワードなどユーザーの入力情報を保存

Cookie

  • ブラウザとサーバ間の通信プロトコル
  • 4096バイトのASCII文字列を保存
  • ブラウザごとに保存

HttpOnly属性

クライアント側でJavaScriptなどからアクセス不可にするもの

Set-Cookie

  • Webサーバからブラウザに送信する

HTTP/2

  • HyperText Transfer Protocol version 2
  • バイナリフレーム
  • ストリームの並行処理、優先度設定
  • HTTPヘッダの圧縮
  • HTTPSでの通信
  • サーバプッシュ

データURL

HTMLやCSSにデータを直接埋め込む

HPACK

  • 2度目以降はヘッダフィールドの通信データ量を削減
  • HTTP/2で使われるアルゴリズム

SOAP

  • 異なるコンピュータ上でWebサービス間でメッセージを、連携するプロトコル
  • XML形式
  • 主にHTTP

Basic認証

  • 簡易的な認証
  • Base64でエンコード
  • Authorizationヘッダに付加して送信される
  • 認証が失敗 → ステータスコード401

Base64

  • エンコード方式
  • 64文字で表す(a~zA~Z0~9+/
  • ファイルのサイズが1.3倍に

Digest認証

  • バイナリデータマルチバイトの文字を64種類の英数字と一部の記号のみに置き換える(ハッシュ化MD5でダイジェスト化
  • 改ざんや覗き見が困難
  • 暗号化しない

クロスサイト・リクエスト・フォージェリ

  • CSRF: Cross Site Request Forgeries
  • 攻撃用Webページにアクセスすると、ページ内に用意されていた不正なHTTPリクエストが攻撃対象サーバに送られます
  • 対策 サーバで外部サイトのリクエストを受け取らないようにする

SQLインジェクション

  1. データベースを不正に操作、SQLを挿入
  2. データベースを不正の操作
  3. データ消去、改竄 → 情報漏洩
  4. 対策 入力値を適切にエスケープ処理
  5. 対策 プリペアードステートメント(変数入りのSQL文をあらかじめ作成しておく)を使用

クロスサイト・スクリプティング

  1. HTMLに悪質なスクリプトを埋め込む
  2. 別のWebサイトへと誘導する
  3. 対策 悪意あるスクリプトに対して出力値を適切にエスケープ処理

ディレクトリ・トラバーサル

  • 本来アクセスできないはずのファイルにアクセス
  • 対策 アクセス権を設定
  • 対策 絶対パスに変換

HTTPヘッダ・インジェクション

  1. HTTPリクエストに、不正な文字列を挿入
  2. WebサーバからのHTTPレスポンスを不正操作
  3. 対策 改行をエスケープ処理、入力エラーとする

Web広告

MVCアーキテクチャ

  • Model-View-Controller
  • ソフトウェア設計モデル

data URIスキーム

  • データ(画像など)をリンクではなく直接HTMLに書き込む
  • base64で変換

マイクロデータ

  • 検索エンジン、プログラムが理解
  • itemscope … 宣言
  • itemtype … URL
  • itemprop … プロパティ
<div itemscope itemtype="http://schema.org/Person">
	<p>このサイトの著者は<span itemprop="Name">ida</span>です。</p>
	</div>

このサイトの著者はidaです。

RDF

  • Resource Description Framework
  • XMLベースのメタデータを記述するための仕様

RDFa

  • Resource Description Framework in Attributes
  • RDFによるメタデータをXHTMLに埋め込むための仕様

OGP

  • Open Graph Protocol
  • SNSでシェアするときに、その内容を表示

画像ファイル

インターレース

  • 画像全体をとびとび(通常は上から)に表示
  • GIFPNG
  • 徐々に鮮明に表示

W3C

  • World Wide Web Consortium
  • Web関連技術の標準化を目的とした非営利団体
  • DOM、HTML、CSSを標準化

WHATWG

  • Web Hypertext Application Technology Working Group
  • HTML、Web関連技術の開発コミュニティ
  • Apple、Mozilla、Operaのメンバーが設立
  • 2019年以降W3Cと共同でHTML、DOMの仕様を統一、開発

IETF

  • Internet Engineering Task Force
  • インターネット技術の標準化を推進する任意団体
  • HTTPを標準化
W3C
WHATWG
IETFHTTPを標準化