第6回 APIを組み合わせてマッシュアップサイトを作ってみる - マッシュアップ講座
ZAPA先生のマッシュアップ講座
Lecutures on PHP
第6回 APIを組み合わせてマッシュアップサイトを作ってみる (その1)
地域限定の天気予報、写真、動画を表示するマッシュアップサイトを作る
第3回、第4回、第5回とさまざまなWeb サービスAPI の利用方法を解説してきました。どれもほとんど同じような手順でAPIを利用できることが理解できたと思います。実は、REST 形式でXML を返すAPIであれば、他のサイトやサービスが提供するAPIでもほとんど同じような手順で利用できるのです。
今回は、前回までの３つのAPIを組み合わせてマッシュアップサイトを作っていきます。指定した地域限定の天気予報、写真、動画を表示するマッシュアップサイトです。マッシュアップだからと言って、それほど難しく考えることはありません。今まで、それぞれのAPIを利用してHTMLタグを生成して返す関数を作ってきたのは、再利用しやすいようにするためです。
したがって、マッシュアップサイトだからと言って、今まで作ってきた関数に手を加える必要はありません。今まで通り、それぞれの関数に引数を与えてコールするだけです。
今回は、地域に「横浜」を設定して、横浜の天気予報、写真、動画を表示してみることにします。リクエストパラメータを以下のように設定して、これまで作成してきた関数を順番にコールします。
//リクエストパラメータ設定 $city = "70"; //横浜を設定 $day = "tomorrow"; //tomorrow（明日の天気）を設定 $keyword = "横浜"; //横浜を設定 $limit = 5; //取得件数に5件を設定 //それぞれの関数を順番にコールする echo lwws($city,$day); echo photozou($keyword,$limit); echo youtube($keyword,$limit);
これだけで、「横浜」の地域情報を確認できるマッシュアップサイトを作ることができます。以下のリスト1は、サンプルプログラムになります。
● リスト1 area.php
1 <html>
2 <head>
3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
4 <title>地域限定の天気予報、写真、動画を表示するマッシュアップサイトを作る</title>
5 </head>
6 <body>
7 <?php
8
9 function lwws($city,$day){
10
11 //XMLデータ取得用ベースURL
12 $req = "http://weather.livedoor.com/forecast/webservice/rest/v1";
13
14 //XMLデータ取得用リクエストURL生成
15 $req .= "?city=".$city."&day=".$day;
16
17 //XMLファイルをパースし、オブジェクトを取得
18 $xml = simplexml_load_file($req)
19 or die("XMLパースエラー");
20
21 //$xmlオブジェクトの中身を確認する場合は、以下のコメントを外す
22 /*
23 echo "<pre>";
24 var_dump ($xml);
25 echo "</pre>";
26 */
27 $ret = '<div class="lwws">';
28 $ret .= "<div>".$xml->title."</div>";
29 $ret .= "<div><img src=\"".$xml->image->url."\"
alt=\"".$xml->image->title."\"></div>";
30 $ret .= "<div>".$xml->description."</div>";
31 $ret .= "<div>最高気温".$xml->temperature->max->celsius."度</div>";
32 $ret .= "<div>最低気温".$xml->temperature->min->celsius."度</div>";
33 $ret .= "</div>";
34 return $ret;
35
36 }
37
38 function photozou($keyword,$limit){
39
40 //XMLデータ取得用ベースURL
41 $req = "http://api.photozou.jp/rest/search_public";
42
43 //XMLデータ取得用リクエストURL生成
44 $req .= "?type=photo&keyword=".urlencode($keyword)."&limit=".$lim
it;
45
46 //XMLファイルをパースし、オブジェクトを取得
47 $xml = simplexml_load_file($req)
48 or die("XMLパースエラー");
49
50 $ret = '<div class="photozou">';
51 foreach ($xml->info->photo as $photo){
52 $ret .= "<a href=\"".$photo->url."\">";
53 $ret .= "<img src=\"".$photo->thumbnail_image_url."\" alt=\"".
$photo->photo_title."\">";
54 $ret .= "</a>\n";
55 }
56 $ret .= "</div>";
57 return $ret;
58 }
59
60 function youtube($keyword,$limit){
61
62 //dev_idを設定
63 $dev_id = "取得したDeveloper ID";
64
65 //XMLデータ取得用ベースURL
66 $req = "http://www.youtube.com/api2_rest";
67
68 //XMLデータ取得用リクエストURL生成
69 $req .= "?method=youtube.videos.list_by_tag";
70 $req .= "&dev_id=".$dev_id."&tag=".urlencode($keyword).
"&page=1&per_page=".$limit;
71
72 //XMLファイルをパースし、オブジェクトに代入
73 $xml = simplexml_load_file($req)
74 or die("XMLパースエラー");
75
76 $ret = '<div class="youtube">';
77 foreach ($xml->video_list->video as $video){
78 $ret .= '<object width="340" height="280"><param name="movie"
value="http://www.youtube.com/v/';
79 $ret .= $video->id;
80 $ret .= '"></param><param name="wmode" value="transparent">
</param>';
81 $ret .= '<embed src="http://www.youtube.com/v/';
82 $ret .= $video->id;
83 $ret .= '" type="application/x-shockwave-flash"
wmode="transparent" width="340" height="280">';
84 $ret .= '</embed></object>'."\n";
85 }
86 $ret .= "</div>";
87 return $ret;
88 }
89
90 echo "<h1>地域限定の天気予報、写真、動画を表示するマッシュアップサイトを作る</h1>\n";
91
92 //リクエストパラメータ設定
93 $city = "70"; //横浜を設定
94 $day = "tomorrow"; //tomorrow（明日の天気）を設定
95 $keyword = "横浜"; //横浜を設定
96 $limit = 5; //取得件数に5件を設定
97
98 //それぞれの関数を順番にコールする
99 echo lwws($city,$day);
100 echo photozou($keyword,$limit);
101 echo youtube($keyword,$limit);
102
103 ?>
104 </body>
105 </html>
- 1
- 2
ページのトップへ
今回のような実践的な経験がエンジニアのキャリアに繋がると思います。是非サービスを成功させて下さい！