
いまさら聞けないリッチクライアント技術(10)
いまさら聞けない「マッシュアップ」超入門
江原顕雄
2008/3/13
Web 2.0時代の産物「マッシュアップ」
- - PR -
最近はやや落ち着いてきましたが、「Web 2.0」の登場とブームはネットサービスに大きな影響を与えました。Web 2.0とは、特定の意味を表す単語ではなく、さまざまなサービスや現象をまとめて表したものです。Web 2.0の用語として、ロングテール、集合知、フォークソノミー、SNS(ソーシャルネットワークサービス)…… などなどが登場しました。
そのWeb 2.0のキーワードの1つとして「マッシュアップ」があります。今回はこのマッシュアップについて見ていましょう。
もともとは音楽用語で「混ぜ合わせる」という意味
「マッシュアップ」(Mash Up)という単語は「混ぜ合わせる」という意味で、もともとは音楽用語です。いろいろな曲を混ぜ合わせて(マッシュアップして)、違う曲にしてしまう手法のことです。
転じて、Web上で使われる「マッシュアップ」は「2つ以上のWebサービス(Web API)を利用して混ぜ合わせて新しいサービスを生み出す」ことを指します。
編集部注:Web APIについて詳しく知りたい読者は、記事「プログラマならWeb APIという巨人の力を使っちゃえ!」をご参照ください
![]() |
| 図1 マッシュアップの概念図 |
■ マッシュアップの例
百聞は一見にしかず! ということで、実際にマッシュアップされているサイトの例として「Weather Bonk」を見てみましょう。
![]() |
| 図2 「Weather Bonk」のページ |
アクセスをすると、Googleマップ(Google Maps)の上に天気予報のデータが掲載されています。どの場所がどんな天気なのか直感的に分かるサービスですね。このサイトは地図のデータをGoogleマップから、天気の情報を提供しているサイトの2つの機能を使ってサービスを提供しています。
![]() |
| 図3 「Weather Bonk」におけるマッシュアップの概念図 |
もし、地図データや天気情報を何もないところから自分で作成しようとすると、膨大な時間とお金が必要です。しかし、複数のWebサービスをマッシュアップすることによって、手軽にお金を掛けずにサービスを提供できるのです。
■ マッシュアップを支える2つの技術
Googleのサービスを利用したマッシュアップの例を取り上げました。が、ここではどのようにしてGoogleのサービスを利用しているのでしょうか? キーワードとなるのが「Web API」です。
例えば、「Googleの検索 API」を利用すれば、簡単にGoogleの検索機能だけを利用できますし、AmazonのAPIを利用すれば、Amazonで取り扱っている商品のデータベースを簡単に使うことができます。いろいろな企業がWeb APIをリリースしており、その数は増える一方です。
XMLもマッシュアップを支えるための重要な要素の1つです。Web APIは検索・編集・加工といった「機能」面の働きをしていますが、Web APIで提供されるデータフォーマットとして主にXMLが利用されています。
XMLで提供されているデータは加工や編集がとても手軽にできるのが特徴です。なので、「A」というWeb APIから得たXMLデータを「B」というWeb APIで利用する…… といった使い方ができるのです。もし、それぞれが勝手なフォーマットでデータを提供していたら、Web API間でデータをやりとりするのもとても大変な作業になってしまいます。
実際にWeb APIを体験してみよう
では、実際にWeb APIを体験してみましょう。例として、Yahooの検索APIを利用します。手順としては調べたい単語をYahoo APIにアクセスをして結果を得るといった形になります。
Web APIに問い合わせをする方法にはいろいろありますが、今回はWebブラウザのURLを使って利用します。Webブラウザのアドレス欄に以下の文字列を入力します。
http://api.search.yahoo.co.jp/WebSearchService/V1/webSearch?appid=Yahoo |
![]() |
| 図4 Internet ExplorerにURLを入力して実行! |
すると、Yahoo!で「@IT」を検索した結果が、図5の画面のようにXML形式で送り返されてきます。
![]() |
| 図5 実行した結果、取得したXML形式の情報 |
このままではとても見にくいですが、このXMLデータを使って、違うWeb APIで編集・加工して、マッシュアップを行うのです。
マッシュアップのメリット/デメリットとは?
マッシュアップには次のような多くの利点が挙げられます。
- 開発するトータルコスト(開発環境・手間・時間)が安く済む
- アイデアさえあれば、手軽に始めることができる
- 機能の追加・削除が手軽に行える
一方で、デメリットも存在します。それは、以下のことです。
- 機能がWeb APIに依存しているので、Web API側がサービス自体の停止・変更やバージョン変更などされた場合、大きな影響を受けてしまう(参考「マッシュアップの落とし穴。誰がために結び付けるのか」)
これは、最も大きな弱点といえます。
また、Web APIのサービスによっては1分間に何回までの利用、といった使用の制限もあるので、利用する際に規約をしっかりとチェックしておかなければなりません。
![]() |
| 図6 Web APIの規約の例 |
次のページでは、Web APIやマッシュアップの例をいくつか紹介します。
| 1-2-3 |
| INDEX | ||
| いまさら聞けないリッチクライアント技術(10) いまさら聞けない「マッシュアップ」超入門 |
||
| Page1 Web 2.0時代の産物「マッシュアップ」 もともとは音楽用語で「混ぜ合わせる」という意味 実際にWeb APIを体験してみよう マッシュアップのメリット/デメリットとは? |
||
| Page2 Web APIにはどんなものがあるの? マッシュアップの例をいくつか見てみよう |
||
| Page3 マッシュアップはツールもオンライン 「マッシュアップ」という言葉 |
||
いまさら聞けないリッチクライアント技術 バックナンバー
- 第1回 いまさら聞けないWeb2.0時代のXML入門
- 第2回 いまさら聞けないJavaScript入門
- 第3回 いまさら聞けない、“Ajax”とは何なのか?
- 第4回 いまさら聞けない“Web標準”、そしてXHTML+CSS
- 第5回 いまさら聞けない! FlashとActionScriptについて
- 第6回 “リッチクライアント”に至るまでの軌跡と現在(いま)
- 第7回 いまさら聞けないウィジェット/ガジェットで気分転換
- 第8回 いまさら聞けないActiveX&デジタル証明書入門
- 第9回 いまさら聞けないSVG、なぜ知られていないのか?
- 第10回 いまさら聞けない「マッシュアップ」超入門
- 第11回 いまさら聞けない「Webブラウザ」超入門
- 第12回 いまさら聞けない「Webブラウザ」超入門 後編
- 第13回 いまさら聞けない「SEO」で検索結果の最適化を学ぶ
- 第14回 いまさら聞けないオフラインWeb、スタンドアロン型とは
- 第15回 いまさら聞けない「Curl」入門(お菓子じゃない方)
- 第16回 開発現場のUIトラブルを解決!? 画面プロトタイプ入門
| リッチクライアント&帳票 全記事一覧へ |
TechTargetジャパン
- コンテンツ政策ヲ転換セヨ! (2012/2/10)
mixiにしろTwitterにしろニコ動にしろ、ソーシャルサービスは伸びている。シロウトの個人が作るコンテンツで成り立つサービスだ - NFCやLTE対応予定のiPhoneと、先行するAndroid (2012/2/9)
iPhoneとAndroid、そしてWindows Phoneという3つのOSの今後を占う。それぞれの通信規格とコンセプトは? - 家電のUIになるブラウザ (2012/2/3)
未来の家電はインターネットに接続でき、ブラウザが内蔵されてくる。家電にブラウザが載ったらどうなるか? 未来のホームネットワークを想像しよう - 「汎用のUI技術」として広がるHTML5 (2012/2/2)
すさまじい勢いで成長しているHTML5を中心としたオープンなWebプラットフォーム。HTML5やAPI、Webブラウザのアップデート情報をお伝えする
|
|






