Webサービスを使って楽しもう
|
Webサービスは登場当初から、アプリケーション連携（EAI）の面が強調されてきました。現在、Webサービスは「Web サイトが持つコンテンツや機能を外部に提供する」という方向での利用が拡大しています。今回は、Yahoo！やAmazonなどの有名サイトが提供しているWebサービスを使ってアプリケーション作りを楽しんでみます。簡単にできますので、次世代の開発を垣間見る意味でも、一度体験されることをお勧めします。
JavaScriptから使ってみよう
まずは、JavaScriptを利用して「Yahoo！検索Webサービス」を呼び出してみましょう。LIST1がそのサンプルコードです。このサンプルでは、テキストボックスにクエリが入力されると即座に検索処理が実行され、テキストボックスの下部に検索結果が表示されます。キーを押すたびに検索が実行されますので、表示される検索結果はどんどん変わっていきます。いわゆるAjax(注4)的な動きをします（画面1）。
このサンプルには2つのポイントがあります。1つ目は、リクエスト用のURL組み立てです。Yahoo！検索WebサービスではRESTを用いて通信を行ないます。今回はHTTPのGETメソッドを利用しているため、検索用のクエリなどはすべてURLに埋め込まれます。2つ目のポイントは、XMLHttpRequestクラスです。XMLHttpRequestは、HTTP通信とDOM(注5)の機能を兼ね備えたクラスで、Webサービスへのアクセスと取得した結果の解析には、まさにぴったりと言えます。XMLHttpRequestに慣れていないと、このサンプルコードは複雑に見えるかもしれません。しかし、実際に処理している内容は前述のとおり、HTTPリクエストの送出と受け取った結果の解析のみの非常に単純なものです。
なお、今回利用しているXMLHttpRequestクラスは、セキュリティ上の都合で本来HTMLが設置されているのと同一ドメインにしかアクセスできません。ただし、HTMLファイルをローカルマシンに配置している場合、Internet ExplorerなどのWebブラウザでは外部にアクセスすることが可能です。そのため、サンプルはローカルマシンに配置しないと動作しない作りになっています。
LIST1 JavaScriptを利用してYahoo！検索Webサービスを呼び出す
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<title>Yahoo検索 Web サービスサンプル </title>
<script type="text/javascript">
<!--
function searchByYahoo() {
/* テキストフィールドに入力された値を使用してリクエスト用のURLを組み立てる。[ID]にはYahoo！検索Webサービス用に取得したIDを入れる */
var keyword = document.myform.query.value;
if(keyword == null || keyword == ""){
return;
}
var request = "http://api.search.yahoo.co.jp/WebSearchService/V1/webSearch?appid=[ID]&query="
+ encodeURI(keyword);
/* XMLHttpRequestにリクエストの情報をセットして送信 */
var httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
/* 検索結果を受け取った後の処理。検索結果のXMLはXMLHttpRequestが解析してくれるので、そこからタイトルとURLを受け取ってHTMLを組み立てる。HTMLは“result”というIDのブロックにセットする */
httpRequest.onreadystatechange = function(){
if (httpRequest.readyState == 4) {
if (httpRequest.status == 200) {
var rootElement = httpRequest.responseXML;
var resultElements = rootElement.getElementsByTagName('Result');
var html = "<br><ul>";
for (var i = 0; i < resultElements.length; i++) {
var resultElement = resultElements[i];
var title = resultElement.getElementsByTagName('Title')[0].firstChild.nodeValue;
var url = resultElement.getElementsByTagName('Url')[0].firstChild.nodeValue;
html += "<li><a href=\"" + url + "\">" + title + "</a></li>";
}
html += "</ul>";
document.getElementById('result').innerHTML = keyword + "<br>" + html;
}
}
}
httpRequest.open("GET", request, true);
httpRequest.setRequestHeader("Content-Type" , "text/xml");
httpRequest.send(null);
}
//--> </script> </head> <body> Yahoo 検索 Web サービスサンプル <br>
/* 検索用クエリを入力するテキストフィールド */
<form name="myform">
QUERY : <input type="text" name="query" onkeyup="searchByYahoo()">
</form>
/* 検索結果を表示するブロック */
<div ><br></div>
</body> </html> ※ このサンプルは Internet Explorerでのみ動作可能。 ..
画面1 LIST1を実行したところ
Javaから使ってみよう
では次に、JavaプログラムからYahoo！検索 Webサービスを呼び出してみます。LIST2がサンプルコードになります。このサンプルは、コマンドラインから検索用のクエリを受け取り、Yahoo！検索Webサービスで検索をします。その後、検索結果を標準出力に出力します。入力／出力が異なるだけで、基本的には先ほどのJavaScriptのサンプルとまったく同じ処理内容となっています（画面2）。
このサンプルには3つのポイントがあります。1つ目は、JavaScriptのサンプルと同じくリクエスト用のURL組み立てです。ここでもJavaScriptのサンプル同様に、REST用のURLを作成しています。
2つ目は、java.net.URL(注6)とjava.net.URLConnection(注7)によるWebサービスの呼び出しです。java.net.URLやjava.net.URLConnectionはJ2SE（Java 2 Standard Edition）で標準提供されているクラスですので、J2SE環境下であれば簡単に利用できます。当然ですが、java.net.URLConnectionの代わりにJakarta Commons Net(注8)など外部のライブラリを利用しても問題ありません。
3つ目は、DOMによる検索結果の解析です。JavaではXMLの解析方法は種々ありますが、ここではJAXP(注9)のDOMを利用して解析を行なっています。結果的にXMLが解析できればまったく問題ありませんので、必要に応じてSAX(注10)などのほかの手段を使っても構いません。
LIST2 Javaを利用してYahoo！検索Webサービスを呼び出す
import java.io.IOException;
import java.io.InputStream;
import java.io.UnsupportedEncodingException;
import java.net.MalformedURLException;
import java.net.URL;
import java.net.URLConnection;
import java.net.URLEncoder;
import javax.xml.parsers.DocumentBuilder;
import javax.xml.parsers.DocumentBuilderFactory;
import javax.xml.parsers.ParserConfigurationException;
import org.w3c.dom.Document;
import org.w3c.dom.Node;
import org.w3c.dom.NodeList;
import org.xml.sax.SAXException;
public class YahooWebServiceSample {
public static void main(final String[] args) throws IOException,
ParserConfigurationException, SAXException {
if (args == null || args.length <= 0) {
return;
}
YahooWebServiceSample .search(args[0]);
}
protected static void search(final String keyword) throws IOException,
ParserConfigurationException, SAXException {
/* メソッドの引数として受け取った値を使用してリクエスト用のURLを組み立てる。[ID]にはYahoo！検索Webサービス用に取得したIDを入れる */
String encodedKeyword = URLEncoder.encode(keyword, "UTF-8");
URL request = new URL(
"http://api.search.yahoo.co.jp/WebSearchService/V1/webSearch?appid=[ID]&query="
+ encodedKeyword);
/* URLConnectionを使用してリクエストを送信 */
URLConnection connection = request.openConnection();
InputStream is = null;
try {
is = connection.getInputStream();
/* 検索結果のXMLはDOMを使用して解析する。DOMからタイトルとURLを受け取って標準出力に出力する */
DocumentBuilderFactory factory = DocumentBuilderFactory
.newInstance();
DocumentBuilder builder = factory.newDocumentBuilder();
Document document = builder.parse(is);
Node rootElement = document.getFirstChild();
NodeList children = rootElement.getChildNodes();
for (int i = 0; i < children.getLength(); i++) {
Node child = children.item(i);
if ("Result".equals(child.getNodeName())) {
NodeList grandchildren = child.getChildNodes();
String title = null;
String url = null;
for (int j = 0; j < grandchildren.getLength(); j++) {
Node grandchild = grandchildren.item(j);
if ("Title".equals(grandchild.getNodeName())) {
title = grandchild.getFirstChild().getTextContent();
} else if ("Url".equals(grandchild.getNodeName())) {
url = grandchild.getFirstChild().getTextContent();
}
}
System.out.println("" + title + "-" + url);
}
}
} finally {
if (is != null) {
is.close();
}
}
}
}
画面2 LIST2を実行したところ
2つのWebサービスをミックスして使う
最後にもう1つ、簡単なサンプルアプリケーションをJavaScriptで組んでみました。もうすぐトリノオリンピック開催ということで、トリノオリンピックに関する情報を集約する自分専用ポータルです。
このサンプルでは、Yahoo！検索WebサービスとAmazon Webサービスを利用しています（画面3）。先ほどとまったく同じ要領で単純にJavaScriptを使用してWebサービスを呼び出しているだけなので、作成は非常に簡単ですが、この画面でトリノオリンピックの最新情報をいつもウォッチできてとても便利です（多分）。
画面3 トリノオリンピックに関する情報を集約する「自分専用ポータル」
このサンプルの情報ソースはYahoo！とAmazonだけですので、実際のところ、便利という印象はあまり受けないかもしれませんが、Googleやブログ検索サービスなどをさらに呼び出すことで、どんどん便利にしていくことができます（多分）。定期的に集めたい情報がある場合には、この仕組みが意外と重宝するかもしれません。
おわりに
Webサービスの背景と簡単な使い方をざっと眺めてきました。Webサービスとはいったいどういうものであるかは、概ね理解していただけたのではないかと思います。
既存サービスを利用して2次サービスを提供するWebアプリケーションの開発は、まだ少ないと思います。しかし、Webサービスなどの環境が段々と整ってきていますので、今後は2次サービス提供などWebサービスを利用したシステムの開発も徐々に増えてくることでしょう。
現在のWebサービスは、技術としては非常に新しいものです。そのため、各社各様に仕様を決め、利用者はそれに従うしかないのが現状です。一部OpenSearch(注11)などの標準化に向けた動きも見られますが、現時点ではまだまだと言ったところです。今後はトランザクション管理やセキュリティといった分野でもWebサービスのインターフェイスに関する標準化が進み、Webサービスがさらに使いやすくなってくると思います。とりあえず今はそのときを待ちながら、いろいろなWebサービスを使って楽しんでいることにしましょう。
（注4） JavaScriptの非同期通信機能を利用して、ノーマル の HTMLよりもリッチなインターフェイスを実現する 技術。
（注5） Document Object Modelの略。 XMLを解析する 方法の 1つ。
（注6） URLを表わすクラス。 J2SEに標準で用意されている。
（注7） java.net.URLの情報を基に実際に Webサーバーと 通信を行なうクラス。 J2SEに標準で用意されている。
（注8） Javaのオープンソースソフトウェア開発を行なって いるApache Jakartaプロジェクトが開発しているネット ワーク通信用の汎用ライブラリ。
（注9） Java API for XML Processingの略。 JavaでXML 文書の読み書きなどの処理を行なう機能。
（注10） Simple API for XMLの略。DOMと同様にXML を解析する方法の 1つ。
（注11） http://opensearch.a9.com/
石川智久（いしかわともひさ）
元々はテーブル設計が得意分野だったが、より概念的な方向に興味を持ちはじめ、アナリシスパターン的な世界へ徐々に移行中。一方で、アーキテクトとしてプロジェクトに参加する機会も増え、自分が「アーキテクト」なのか「モデラー」なのか分からなくなっている。中堅SIerを経て、2002年より現職。
高橋英一郎（たかはしえいいちろう）
JavaによるWebアプリケーション開発一筋で生計を立てている。現職では商用J2EE Webアプリケーションフレームワークの開発に従事。いかにして楽にWebアプリケーションを構築するか、日夜頭を悩ませている。
山本啓二（やまもとけいじ）
関東在住の阪神ファン兼コンサルタント。日本シリーズ観戦成績が、3年越しで4連敗となりました。ロッテの強さは本物ですね。でも、来年4勝して5割に戻す予定です。著書に『プログラマの「本懐」』