APIを利用したWebアプリケーションを題材に,実装の方法を解説します。JavascriptのライブラリはjQueryを使用します。jQueryによるAjax実装,基本的な使い方,また,UIへの応用実装も合わせて解説します。Javascript+XMLの略称です。Javascriptを使い,Webページとは非同期(Asynchronous)にXML形式(もしくはテキスト形式)のデータ通信を行う手法を指します。Ajaxを使うと特別なプラグインなどを必要とせず,Webページの必要な部分だけ必要に応じて書き換えることができるため,ユーザビリティの高いWebアプリケーションを作ることができます。異なるWebサービスをまとめたりすることもできるため,既存のWebサービスから別の価値を生み出すWebアプリケーションを作ることができます。Ajaxは技術であり,より良いWebアプリケーションを作るのは「使い方次第」です。使い所やポイントについては,連載の最後に書きたいと思います。皆さんも一度は目にしたことがあると思います。MapsWebページ全体を再読み込みすることなく,地図をドラッグしたり,ズームしたりすることができます。Mapsではドラッグして地図を「ずらす」ことができます。よって,頭の中で図面のつながりを保ったまま,地図を移動させることができます。Ajaxがとても効果的に使われています。Ajaxは難しい?Ajaxは既存の技術の組み合わせなので,それぞれはそう難しくありませんが,1から実装すると,複数のブラウザの対応,クロスドメインアクセス,セキュリティの問題など,いろいろと頭を悩ますことになります。最近では,Ajaxを簡単に使うためのライブラリ,また,開発ツールにもAjaxを使う仕組みが標準で組み込まれ,Ajaxを扱うための環境が揃いつつあります。本連載では,jQueryというJavascriptライブラリを使い,簡単にAjaxを実装する方法を解説します。本連載は,Ajaxの実装をしたことがない人に向けたものですので,完成されたアプリケーションを解説するのではなく,少しずつ実装を加えながら解説するというように進めます。APIとは,YouTubeが提供しているWebサービスを,プログラムから利用できるように公開されたAPIです。YouTubeの様々な機能を利用したり,他のWebサービスや自作のプログラムと組み合わせることができます。APIがリリースされました。APIs(GData)に準拠して新しく実装されています。2007年1月現在では認証は不要です。Youtubeのアカウントを取得する必要はありません(現段階では読み取り専用のため⁠)⁠。本連載ではこの新しいバージョンで実装します。APIを参照してください。本連載でも実装に必要なところは随時解説します。ビデオを検索するAPIYouTubeの検索結果はfeedとして返されます。feedなどいくつかの種類が用意されています。feedを使ってみましょう。呼び出し方は以下のようになります。APIで使用できるパラメータを付与して問い合わせます。referenceを参照ください。catというキーワードで,最大件数を10件として検索するには以下のようにリクエストします。http://gdata.youtube.com/feeds/api/videos?vq=cat&max-results=10データフォーマットaltパラメータに,応答データのフォーマットを指定することができます。何も指定しないとatom(Atomフォーマット)になります。その他,rss,JSON,json-in-script(JSONP)を指定することができます。今回は,JSON-in-script(JSONP)を使用します。JSON,JSONPおよびクロスドメインアクセスに伴う問題については次回説明します。文字エンコーディング応答データの文字エンコーディングはUTF-8です。ソースコードはUTF-8で作成してください。Ajax著者プロフィール池田正一(いけだまさかず)仕事ではもっぱらJavaを使い,たまにC/C++を書かされ,WebサービスをRubyで開発するプログラマ。ドラえもん好きでドラえもんSuperDatabaseの管理人。stacktrace.jpにて頭の中のStackを出力中。2019」を開催しました。DAY1・DAY2の様子を注目セッションとともにお伝えします。LINEのエンジニア3名がイベントに先駆けて見どころを紹介します。コードの安全性・安定性を高める開発サイクル~テスト管理の効率を上げ,脆弱性診断を自動で行う~本連載では,連載「業務を改善する情報共有の仕掛け」を受けつつ,安全性・安定性を加えた開発サイクルについて考えていきます。若者世代から圧倒的な人気を誇るライブ配信&動画投稿コミュニティアプリ「MixChannel」(ミクチャ)の裏側(レコメンドシステムやサーバサイド開発など)について解説していきます。その他の連載CSS3アニメーションでつくるインターフェイス表現CSS3によるアニメーション表現を紹介していきます。その中でも,幅広い読者に応用してもらえるだろうインターフェイスを主なお題とします。MySQL道普請便り本連載では,MySQLを使ったアプリ開発・運用に関するノウハウをご紹介していきます。RecipeUbuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。JavaScriptセキュリティの基礎知識JavaScriptに関するセキュリティ上の問題はどこで発生し,どうすれば防ぐことができるのか?について解説していきます。〜システムをきちんと運用するための基礎知識システムは「作って終わり」ではなく,運用の中でさまざまな問題が発生します。問題の発生に備えて事前にどのような対応をしておくべきなのか,問題発生時に何をしなければならないのか,ポイントを解説していきます。きたみりゅうじの聞かせて珍プレーソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。Linuxのメンテナンスの傍ら,Linuxやオープンソースソフトと日々を過ごす著者が,その魅力とつきあい方を,エッセイ風味でお届けします。PRESS特別編集部員,さわやか笑顔のスーパーハカーはまちちゃんとネット大好き14歳わかばちゃんが,毎号,読者の皆さんから寄せられたおたよりを紹介します。皆さんの日頃の悩みにも答えちゃいますよ。]メールでのお知らせメールで次の案内をお送りしております。メールの配信を希望する方は,利用したい項目をチェックしてメールアドレスを入力し,[登録]ボタンをクリックしてください。UPDATES[ほぼ週間に1回]新刊メールマガジン[ほぼ週間に1回]電脳会議の各号案内[ほぼ1ヵ月半に1回]※変更する場合や停止する場合は,登録情報変更ページをご覧ください。※登録いただいたメールアドレスには,そのお知らせ以外,配信いたしません。Ltd.ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。