かかれもの(改訂版)

本や写真、現代思想の点綴とした覚書

HATEOASとは何か

RESTにおけるHATEOAS

 それは、REST(REpresentational State Transfer)における、統一インターフェースの一つです*1

統一インターフェース(Uniform Interface)

  1. リソースの識別(identification of resources)
  2. 表現によるリソースの操作(manipulation of resources through representations)
  3. 自己記述的メッセージ(self-descriptive messages)
  4. アプリケーション状態エンジンとしてのハイパーメディアHATEOAS;hypermedia as the engine of application state)

リチャードソンの成熟度モデルにおけるHATEOAS

 それは、RESTへの到達を表すリチャードソンの成熟度モデルにおける、レベル3に相当します。

Steps toward REST

 The point of hypermedia controls is that they tell us what we can do next, and the URI of the resource we need to manipulate to do it. Rather than us having to know where to post our appointment request, the hypermedia controls in the response tell us how to do it.
  ハイパーメディアコントロールの本質は、次に私は何ができるか、リソースのURIに対してどのような操作ができるかを示すことだ。どこにリクエストを送るか事前に知っている必要はない。何をすべきかはレスポンスの中にあるハイパーメディアコントロールが示しているのだから。

「知ること」にとってのHATEOAS

 それは、直感に従って「知ること」を目指すための道標です。

Follow Your Nose

EVOLVE'13 | Keynote | Roy Fielding

RESTから離れて

 SPA(Single Page Application)とRESTの相性が悪いことはよく指摘されます。

 例えば静的なページを対象としたWebクローラは、JSON APIを得意とするSPA(CSR)のクローリングを適切に行うことができません。Googlebotは幸いJavaScriptを実行できますが、タイムアウトの問題を克服しているわけではないので完全とは言い難いでしょう。SSR・SSGといった技術もありますが、単に商業的なSEO対策として利用されるケースが多いようです。

 その他REST的な思想に基づいてJSONをLinked Data*2として拡張する提案が多様にあります。比較的メジャーなJSON-LD(application/ld+json)*3、HAL(application/hal+json)*4、Hydra*5についても浸透しているとは言い難い状況です。これらは人間用とロボット用にWebページを設計する必要があり、開発コストが見合わないことがその要因の一つでしょう。

 SPAを突き詰めるための手段としてのGraphQL*6やgRPC*7は明らかにRESTから遠ざかる方向(SOAPプロトコル*8)を目指しています。人によっては昨今のWebアプリが「打倒ネイティブアプリ!」を掲げているように見えるかもしれません。その象徴がElectron*9でしょうか。

JSON API vs Hypertext API

あるAPI「GET /user?id=1」

{
  "name": "山田太郎",
  "email": "yamada-taro@email.com"
}

 JSON API、素晴らしい!洗練されている!通信のペイロードも少ない!

 しかし、明らかにRESTから遠ざかっています。この情報からは行為の選択肢について何もアフォードされていません。私は次に何をすることができるのでしょう?このユーザに対して何をすることができるのでしょう?

あるAPI「GET  /user?id=1」

<div>
  <div>
    Name: 山田太郎
  </div>
  <div>
    Email: yamada-taro@email.com
  </div>
  <div>
    <a href="/contact/edit">Edit</a>
    <a href="/contact/email">Email</a>
  </div>
</div>

 残念ながらHypertext APIは煩雑なようです。しかし、私ができることは明白です。事前知識が無くても、セマンティクスさえ分かっていれば人間にもロボットにも十分な情報がアフォードされています。

htmx

 htmx*10
トップページには次のような4つの謎めいた提題があります。

  • Why should only a and form be able to make HTTP requests?
    (どうしてaとformだけが唯一サーバと通信できるのでしょう?)
  • Why should only click & submit events trigger them?
    (どうしてクリックとサブミットだけが唯一のイベントトリガーなのでしょう?)
  • Why should only GET & POST methods be available?
    (どうしてGETとPOSTメソッドだけが許されているのでしょう?)
  • Why should you only be able to replace the entire screen?
    (どうして画面全体を書き換えることだけが許されているのでしょう?)

 これらについては作者が動画やエッセイ*11で解説しています。曰くである、non-hypermedia formatからハイパーテクストへの回帰はあるのでしょうか。


www.youtube.com

 

 直感に従ってページの中にあるリンクをクリックすること、それがHATEOASの目指す姿です。

 

recrits.hatenablog.com

 

recrits.hatenablog.com