コンパイラ

Size: px

Start display at page:

Download "コンパイラ"

ぜんすけうすい
4 years ago
Views:

ソフトウェアアークテクチャ第 12 回 WORLD WIDE WEB 環境情報学部萩野達也 1 Web の誕生 1989

自由度が高い現実の関係を表すことができるキーワードをノードとして表す WEB 5 6 Web とは何か Web の基本的仕組み Web

1 ソフトウェアアークテクチャ第 12 回 WORLD WIDE WEB 環境情報学部萩野達也 1 Web の誕生 1989 年にスイスジュネーブ CERN で誕生 Tim Berners-Lee CERN における情報管理のため 2 スライド URL Web = ハイパーテキスト + インターネット最初の Web サーバと Web ブラウザ 3 3 つの方法の比較 4 木構造キーワードハイパーテキスト管理はしやすい現実の関係を表せない検索などは速いキーワードを前もって決めないといけない利用者はキーワードが分からない自由度が高い現実の関係を表すことができるキーワードをノードとして表す WEB 5 6 Web とは何か Web の基本的仕組み Web = インターネット + ハイパーテキストインターネット世界中のネットワークを結ぶネットワーク文章をハイパーテキストとしてで記述文章の場所を URL で指定によりサーバからブラウザに転送ハイパーテキスト他のテキストへのリンクを含むテキスト文章文章文章文章 Internet 文章 Web サーバクライアント Web ブラウザ 1

Web の最初の重要な発明 + CSS Webページの記述言語 : Hypertext Markup Language 内容の記述 CSS: Cascading Style Sheet スタイルの記述 1990 年にはなく, 後で追加 : Hypertext Transfer Protocol Web ページの転送 Anonymous FTP の単純化マルチメディアへの対応

2 Web の最初の重要な発明 + CSS Webページの記述言語 : Hypertext Markup Language 内容の記述 CSS: Cascading Style Sheet スタイルの記述 1990 年にはなく, 後で追加 : Hypertext Transfer Protocol Web ページの転送 Anonymous FTP の単純化マルチメディアへの対応言語ネゴシエーション機能 CSS Web はどうしてこんなに普及したのか? 無料にした Gopher はライセンスの問題で普及しなかった (?) オープンなシステムだれでもが参加可能検索ロボットが自動的に追加ネットワーク効果厳密さにこだわらなかったリンクが切れていることも容認 (404 Not Found) の文法エラーも多数 8 雪だるま式に普及ハイパーテキストとしては欠陥 URL: Uniform Resource Locator Web ページの位置を示す Hypertext のポインタ URL URI IRI 標準化への努力 IETF World Wide Web Consortium 9 10 Web 1.0 から Web 2.0 へ Web の全体構成要素 Web 1.0 Web 2.0 Web 3.0 CSS URL XML Ajax blog SNS Web Services Social Bookmark RDF OWL SPARQL RIF Linked Data XML 個人の発信 read write 企業の発信 read only 個人の発信 read write URI 参照操作組織内世界全体コミュニティ内 Unicode URI (Uniform Resource Identifier) 識別子物 ( オブジェクト ) や概念 ( コンセプト ) を識別する名前や番号身近な識別子をあげてみよう? 個人の識別子本の識別子 PC の識別子場所の識別子オブジェクトコンセプト識別子 11 Web における概念識別子表現概念 (Resource) 識別子 URI (Uniform Resource Identifier) 表現 (Representation) +CSS GIF 識別慶應義塾大学表現 <!DOCTYPE html> <html> <head> <title> 慶應義塾大学 </title> </head> <h1> 慶應義塾大学 </h1> </body> </html> 12 資源 2

3 13 14 URI のシンタックススキーマオーソリティパス問い合わせフラグメントスキーマ (Schema) URI の種類プロトコルオーソリティ (Authority) ホスト名サーバ名パス (Path) オーソリティ内の位置ファイル名問い合わせ (Query) 検索などの検索語フラグメント (Fragment) 内の位置 http では問い合わせまで Web サーバ, フラグメントはブラウザが処理 URI の公理普遍性 (Universality) すべてのは URI を持つ大域性 (Global Scope) URI はどこでも同じ意味を持つ一意性同一性 (Sameness) URI は常に同じものを意味する意味が同じであり, 内容は異なることもある不透明性 (Opacity) URI だけから資源の種類を知ることはできない資源の表現を調べないと種類等はわからない URL, URN, IRI URL (Uniform Resource Locator) 資源の場所を表す URI http ftp URN (Uniform Resource Name) urn:<nid>:<nss> NID を IANA に登録することによって一意性を確保年 5 月現在 42 個が登録 ISBN XML とは XML (Extensible Markup Language) マークアップ言語の 1 つ JIS: 拡張可能なマーク付け言語 1998 年 2 月 W3C が 1.0 を制定現在は 1.0 と 1.1 の 2 つのバージョン XML の必要性 SGML が古すぎる. インターネット時代には即していないだけですべてのが記述できるわけではないだけでなくデータも記述したい複数のを混ぜたい IRI (Internationalized Resource Identifier) 国際化された URI URI ではパスに漢字等は利用できず 16 進数を使うホスト名, パスに Unicode を利用 SGML X XML アプリケーション言語の定義構造化文章は構造を持つ段落, 章, 節, 目次履歴書, 申請書マークアップ (markup) 文章の構造の指定 marking up が語源 SGML により定着 SGML ではタグ (tag) によりマークアップ <coffee price="250"> カフェラテ </coffee> マークアップ文章第 1 章マークアップ第 2 章第 1 節第 2 節 XML の構成要素 XML 宣言 XML であることを示す文字コードの指定 Element 開始タグと終了タグでマークアップ空要素タグ CharData 文字データ Reference < や A などの参照 CDSect CDATA セクション PI 処理命令 Comment コメント <?xml version="1.0" encoding='euc-jp'?>  <restaurant> <name> 慶応レストラン </name> <place>sfc キャンパス内 </place> <menu> <item price="150"> コーヒー </item> <item price ="250"> カフェラテ </item> <item price="400"> サンドイッチ </item> <item price="700"> スパゲッティ </item> </menu> <open from="10:00" to="17:00" /> <networks> <network type=" 無線 LAN" /> <network type=" 有線 LAN" /> </networks> <misc> 快適なひとときを味わえます. </misc> </restaurant> 3

4 19 20 の変遷 XML(SGML) アプリケーションハイパーテキスト XML 1989 年 1994 年 IETF 標準化 2 SGML XML 2000 年 X1.0 携帯端末の特徴内容と表現の分離スタイルは CSS で指定直交する技術を用いる内容 : スタイル : CSS プログラミング : Javascript 映像 1995 年 1997 年 1997 年 1999 年 3 拡大機能集約 3.2 正しいモジュール化 2001 年 X 年 XMLらしく X2.0 X Basic 直交技術ビデオ音声サブタイトル 2014 年 5 簡単な <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD X 1.0 Transitional//EN" " <html> <head> <title>my first document</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <link rel="stylesheet" href="sample.css" type="text/css"/> </head> <h1> 簡単な </h1> <p> は簡単にだれでもが書くことができます.</p> <p> 複数の段落から構成されています.</p> </body> </html> DOCTYPE 宣言によりバージョン指定する初心者には DOCTYPE 宣言は長くて覚えにくい 5 では単純化 <!DOCTYPE html> 21 の要素の分類全体を構成する要素 html, head, body など section, article など段落を構成する要素 block 要素 h1, h2, ul, ol, table など文の中で用いられる要素 inline 要素 (text 要素 ) i, b, em, strong など 22 html head body block 要素 inline 要素 Hyper Text Transfer Protocol 23 (Hypertext Transfer Protocol) を操作するプロトコル 24 TCP/IP 上のプロトコルポート 80 Anonymous FTP を単純化したもの TCP IP Ethernet など主なメソッド HEAD 資源の情報を取得する GET 資源の表現を取得する PUT 資源の作成または更新 DELETE 資源の削除 POST データを資源に置くる HEAD GET 取得処理更新 PUT DELETE POST 4

5 25 26 の変遷年 Request GET <uri> CR LF Reply <html document> 年, 1996 年 RFC1945 Request <Method> <uri> /1.0 CR LF [<request header>*] [CR LF <data>*] Reply /1.0 <status code> <reason> CR LF [<response header>*] [CR LF <data>*] の Request と Reply ユーザエージェント ( ブラウザ ) <method> <URI> /1.0 <header1>: <value1> <header2>: <value2> Request Reply Webサーバ年 11 月 RFC2616 Virtual Hosting TCP/IP Persistent Connection TCP/IP Pipelining Proxy Cache Control /1.1 <status code> <reason> <header1>: <value1> <header2>: <value2> statusコード意味 200 OK 301 Moved Permanently 303 See Other 401 Unauthorized 403 Forbidden 404 Not Found GET と HEAD メソッド GET メソッドの表現の一つを取得する Content ネゴシエーション言語ネゴシエーション HEAD メソッドあるいはその表現に関する情報を取得する GET の一部分 GET の性質 GET 何度使っても安全 GET は冪等 (idempotent) GET に副作用はない日本語 GET GET 27 動画 English GET GET = GET Content ネゴシエーション / 画像形式ユーザエージェント GET keiopenmark Accept: image/png Language format ユーザエージェント keiopenmark.png GET index.html Accept-Language: ja, en-us;q=0.8, en;q=0.7 index.html.ja keiopenmark index.html 28 keiopenmark.jpg keiopenmark.png keiopenmark.gif index.html.en index.html.ja index.html.kr PUT と POST メソッド PUT メソッド資源を作成あるいは更新する GET の逆通常のブラウザは PUT を使わない POST メソッド資源にデータを送る資源はデータを処理するの FORM で利用 GET vs POST FROM の method 属性により GET または POST を指定副作用がない場合に GET 資源の更新など副作用があるときには POST POST は冪等ではない GET PUT POST POST POST Header General Header Date Pragma Request Header Authorization From If-Modified-Since Referer User-Agent Response Header Location Server WWW-Authenticate Entity Header Allow Content-Encoding Content-Length Content-Type Expires Last-Modified Additional Header Accept Accept-Charset Accept-Encoding Accept-Language Content-Language Link MIME-Version Refer-After Title URI 5

31 32 の Status コードのその他の機能 status コード 200 リクエスト成功 201 作成成功 202 リクエスト受理 204 内容なし意味 301 恒久的に移動した 302 一時的に移動している 303 他を参照せよ 305 Proxy を利用しなくてはいけない status コード意味 400 リクエストが不正である 401 認証が必要である 402

6 31 32 の Status コードのその他の機能 status コード 200 リクエスト成功 201 作成成功 202 リクエスト受理 204 内容なし意味 301 恒久的に移動した 302 一時的に移動している 303 他を参照せよ 305 Proxy を利用しなくてはいけない status コード意味 400 リクエストが不正である 401 認証が必要である 402 支払いが必要である 403 アクセスが禁止されている 404 資源が存在しない 405 メソッドが許されない 500 サーバ内部エラー 501 実装されていない転送資源が別のところに移動認証ユーザ名とパスワードによる認証 Basic あるいは Digest 認証 Virtual Host 一つのサーバで複数の Web サイトをホスト DNS の別名を利用 TCP/IP の効率的利用 Persistent connection (keepalive) パイプライン処理 Proxy キャッシュ制御 max-age no-cache public あるいは private WebDAV への拡張 COPY, MOVE, LOCK, UNLOCK S SSL (Secure Sockets Layer) を利用した通信上にを実現ホストの認証通信の暗号化まとめ Web について歴史 URL XML Web のその他の話題検索エンジン (Page Rank) Web サイトデザイン ( 情報アーキテクチャ ) Web データ ( セマンティック Web,Linked Data) 6

第2回 Web文書

第2回 Web文書 Slide URL https://vu5.sfc.keio.ac.jp/slide/ Web 情報システム構成法第 4 回 Webサーバ萩野達也 (hagino@sfc.keio.ac.jp) 1 前回課題 :CNS に Web ページを置きなさい特別教室 CNS 個人用 Web サーバ zmac??? ファイル共有ファイルサーバファイル共有 web.sfc.keio.ac.jp Web