0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

読書要点「Webを支える技術」:第4部「ハイパーメディアフォーマット」

0
Posted at

第10章 HTML

Hypertext Markup Languageの略で、マークアップ言語と呼ばれる。
マークアップ言語でマークアップした文書を構造化文書と呼ぶ。

HTMLのメディアタイプにはtext/htmlとapplication/xhtml+xmlの2種類がある。
拡張子には .html を用いるのが一般的。

XMLの基礎知識

HTML/XHTMLを理解するためには、メタ言語であるXMLの仕様を把握する必要がある。

XMLの木構造

XMLは木構造を持った文書である。

要素

XMLでは要素を用いて文書の構造を表現する。
要素は開始タグ <要素名> と終了タグ </要素名> と記述する。

XMLの木構造は要素を入れ子にして表現する。

内容を持たない要素を空要素といい、終了タグ省略することが可能。
その場合、<要素名/> と記述する。

属性

要素は属性を持つことができる。
開始タグ中に 属性名="属性値" と記述する。
同じ名前の属性は一つのみしか記述できない。
属性の順番に意味はない。

実体参照

以下の5文字はXMLの文書構造の記述のための特殊な文字なので、実体参照という機構を用いて表現する。

文字 実体参照
< &lt;
> &gt;
" &quote;
' &apos;
& &amp;
コメント

コメントを打つ際は以下の記述を行う。
コメント中に --> という文字列の挿入はできない。
<!-- コメント内容 -->

XML宣言

文書の戦闘にはXML宣言が必要になる。

名前空間

名前の衝突を防ぐための機能で、xmlns:接頭辞="名前空間名" と記述する。

HTMLの構成要素

基本的な構成要素はヘッダとボディで、ヘッダにはメタデータを、ボディには文書の内容を記述する。

ヘッダ

ヘッダに入る要素は以下のとおりである。

要素 意味
title 文書のタイトル
link 他のリソースへのリンク
script JavaScriptなどのクライアントサイドプログラム
meta そのほかのメタデータ
ボディ

ボディにはブロックレベル要素とインライン要素がある。

  • ブロックレベル要素

文書の見出しや段落など、ある程度大きな塊を表現する。

  • インライン要素

ブロックレベル要素の中に入る要素で、強調や改行、埋め込みなどを表現する。

共通の属性

HTMLのすべての要素は、id属性とclass属性を持つことができる。

  • id属性

文書内で一意のIDを示す。

  • class属性

その要素が属するクラスで、CSSでのスタイル指定などに用いる。

リンク

HTMLではハイパーメディアフォーマットとして、リンクを埋め込むことができる。
リンクを扱う手段はいくつかある。

  • <a>要素
  • <link>要素
  • オブジェクトの埋め込み
  • フォーム

<a>要素、<link>要素はrel属性を持つことができる。
ページ間の関係を示すほか、スタイルシートの指定によく用いられる。

第11章 microformats

HTML中の属性を用いて、人が読むためのHTMLをプログラムで処理できるように手助けするための技術。
HTMLの知識があれば学習は容易で、必要最低限のコストでWebサービスをWeb API化させることができる。

microformatsの分類

microformatsは大きく2つに分類される。

elemental microformats

リンク関係を使ってメタデータを表現するフォーマット。

  • rel-licence ライセンス情報

リンクのrel属性にlicenceを追加することで、リンク先が参照元のライセンス情報であることを意味する。

  • rel-nofollow スパムリンク防止

検索エンジンの重み付けには、参照リンク数が用いられるが、この仕組みを悪用してコメント欄などを利用し自分のサイトの参照を増やすスパム行為がある。
このスパムを防ぐため、投稿されるリンクにこの属性を付与することで対策を行う。

compound microformats

class属性を用いて階層構造のあるメタデータを表現するフォーマット。

  • hCalendar イベント情報

カレンダー情報、イベント情報を記述するためのフォーマット。
class属性で階層構造を作り、イベント情報を格納していく。

  • hAtom 更新情報

Atomが持つメタデータをHTMLに埋め込むためのフォーマット。
エントリの内容や更新情報について情報を埋め込むことができる。

第12章 Atom

AtomはRFC 4287で規定されたXMLフォーマットで、ブログなどの更新情報を配信するためのフィードとして知られる。
ブログに限らず、検索エンジンや写真管理などさまざまなサービスのWeb APIとして利用することができる。
AtomPubと組み合わせることで、リソースの表現だけでなくHTTPを活用した操作を行うこともできる。

Atomのリソースモデル

Atomの論理モデルは、メンバリソースと、メンバリソースを複数含むコレクションリソースの2つにわけられる。

メンバリソース

Atomの最小のリソース単位。
ブログであれば一つ一つの記事が、画像管理サービスであれば画像一つ一つがメンバリソースとなる。
すを
XMLで表現できるメンバ入りソースはエントリリソース、それ以外はメディアリソースとなる。

コレクションリソース

コレクションは複数のメンバリソースを含むリソース。
コレクションリソースを階層化することはできず、コレクションリソースが別のコレクションリソースに含まれることはない。

コレクションリソースは<feed>要素で表現し、この表現をフィードと呼ぶ。

メディアタイプ

Atomのメディアタイプは application/atom+xml である。

名前空間

Atomの名前空間は http://www.w3.org/2005/Atom である。

エントリ

エントリのルート要素は<entry>要素で、その中にメタデータと内容を記述する。
子要素の順序に意味はない。

メタデータ

ID、タイトル、著者、更新日時は必須。

  • ID <id>
  • タイトルと概要 <title>, <summary>
  • 著者と貢献者 <author>, <contributor>
  • 公開日時と更新日時 <updated>, <published>
  • カテゴリ <catogory>
  • リンク <link>
 エントリの内容

エントリの内容には多彩なフォーマットをふkめることができる。

  • 組み込みで定義されている内容

type属性に従い、プレーンテキスト(text)、エスケープ済みHTML(html)、XHTML(xhtml)を入れることができる。
これらはAtom仕様が組み込みで定義している。

  • XMLの内容

メディアタイプが application/xmltext/xml またはサブタイプが +xml で終わる場合は、<content>要素は直接XML要素を含むことができる。

  • テキストの内容

XML以外のテキストも、CSVをはじめメディアタイプのタイプがtextであれば直接埋め込むことができる。

  • テキスト以外の内容

バイナリデータなどをBase64でエンコードしたものも含めることができる。
データの大きい音声・映像などはsrc属性を使って外部リソースを参照するのがよい。

フィード

メンバリソースを複数持つコレクションリソースの表現。

エントリと共通のメタデータ

<feed>要素はエントリと同じメタデータを持つことができる。
フィードの<author>要素と<contributor>要素は、エントリ中の同要素のデフォルト値となる。

フィード独自のメタデータ
  • サブタイトル <subtitle>
  • 生成プログラム <generator>
  • アイコン <icon
  • ロゴ <logo>

Atomの拡張

Atomは拡張性が高く、拡張要素を用いて様々な場面で用いられる。
Atomフォーマットの仕様で、知らない要素は必ず無視すると定められていることも拡張性の高さを支持する。
代表的な拡張要素を列挙する。

  • Atom Threading Extensions
  • Atom Licence Extension
  • Feed Paging and Archiving
  • OpenSearch

第13章 Atom Publishing Protocol

Atom Publishing ProtocolはAtomPubと呼ばれ、ブラウザ以外のWebクライアントからコンテンツの投稿、システム同士の連携が容易になる。
AtomPubではAtomを利用したリソース編集プロトコルの規定を行っている。
つまり、Atomが規定したフィードやエントリのCRUD操作を実現するためのプロトコルである。
AtomPubはRESTに従って作られたプロトコルである。

AtomPubのリソースモデル

AtomPubではAtomが規定しているリソースモデルをベースにエントリの操作をする。
AtomPubではコレクションのメタデータを表現するサービス文書と、エントリのカテゴリに指定できる値を列挙するカテゴリ文書を追加している。

メンバリソースの操作

エントリ単位での操作
  • GET 取得
  • PUT 更新
  • DELETE 削除
  • POST 作成
メディアリソースの操作

XML文書では画像の送信自体は行うことはできないため、画像本体をPOSTする。

サービス文書

サービス文書では、そのWeb APIが提供するコレクションリソースのメタデータを複数まとめて記述することができる。

  • <service>要素
  • <workspace>要素
  • <collection>要素
  • <>要素
  • <category>要素

カテゴリは、サービス文書ではなく外部のカテゴリ文書で表現することも可能。

第14章 JSON

JSONはJavaScript Object Notationの略で、軽量なデータフォーマット。
記法はJavaScriptだが、多くの言語でライブラリを用意しており、言語間でのデータの受け渡しに向く。
ハイパーメディアフォーマットとしてはリンクの受け渡しのためのメンバを用意して運用することが重要。

メディアタイプ

メディアタイプは application/json である。

データ型

JSONに組み込みで用意されているデータ型は6種類である。

  • オブジェクト

名前と値の集合。
名前と値の組をメンバと呼ぶ。
名前には文字列、値にはJSONのデータ型なら任意のものを入れることができる。

オブジェクトは { で始まり、} で終わる。
メンバは , で区切る。
メンバの名前と値は : で区切る。

  • 配列

0個以上の値を入れることが可能で、任意のデータ型を入れられる。
[ で始まり、] で終わる。
値は , で区切る。

  • 文字列

文字列の入力の際は二重引用符で囲む。
リンクなども文字列として送信するのが最も簡単。

  • 数値
  • ブーリアン
  • null

JSONPによるクロスドメイン通信

Ajaxで用いるXMLHttpRequestというJavaScriptのモジュールは、クロスドメイン通信を許可していない。
そこで、HTMLの<script>要素を用いると、複数のサイトからJavaScriptファイルを読み込める。
ブラウザでは<script>要素にセキュリティ制限を設けていない。

JSONPはこの性質を利用してクロスドメイン通信を実現する手法である。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?