• [アーティクル]

Internet Explorer 8 Beta での AJAX 関連のアップデート

更新日: 2008 年 10 月 6 日

本記事は、Internet Explorer 開発チーム ブログ (英語) の翻訳記事です。本記事に含まれる情報は、Internet Explorer 開発チームブログ (英語) が作成された時点の内容であり、製品の仕様や動作内容を保証するものではありません。本記事に含まれる情報の利用については、使用条件をご参照ください。また、本記事掲載時点で、Internet Explorer 開発チーム ブログ (英語) の内容が変更されている場合があります。最新情報については、Internet Explorer 開発チームブログ (英語) をご参照ください。

翻訳元 : Updates for AJAX in IE8 Beta 2 (英語)


Internet Explorer 8 の AJAX 分野の改良に集中しているプログラム マネージャーのSunava Dutta です。Internet Explorer 8 Beta 2 が公開されたので、我々が行った一連の機能の拡張についていくつか紹介したいと思います。三月に a set of developer experiences (英語) でクライアント サイドのクロス ドメイン データ アクセス、ローカル ストレージ、そして多数の状態を管理するナビゲーションといったAJAX に関するシナリオを取り上げたことを振り返ると、いろいろなことが思い出されるかもしれません。

良いお知らせとして、我々のチームはInternet Explorer 8 Beta 1 の時から、開発者からのフィードバック( ご尽力を感謝します) と現在更新中の W3C 標準化ドラフト( ほとんどの実装がこれを基準にしているか、検討用に提出済みです) を基に我々の実装を調整、更新するための取り組みを続けております。これだけで満足するのではなく、我々は開発者向けの幾つかの新機能を追加しました。詳細については後ほど記載します。

我々が選択した Beta 2 におけるAJAX の更新は、ブラウザー間の互換性の維持することと開発者が最も役立つと考える機能セットにフォーカスしています。難しい話はここまでにして、今回の改良点をお見せしましょう。

XDomainRequest (XDR) (英語)

これはクロス ドメインの呼び出しを安全で簡単にするためにゼロから作り上げたオブジェクトです。不用意なクロス ドメイン アクセスの機会を削減するため、このオブジェクトは、クライアント スクリプトとサーバーからのクロス ドメイン呼び出しを許可するための明示的な確認を要求します。さらに、マッシュアップ ページ内にサード パーティのスクリプトを直接マージするといった危険なやり方を取る必要性を減らします。サード パーティに DOM へのフル アクセス権を与えることになるため、この方法は危険です。これにはさらに、クライアント側のパフォーマンスが改善され、サーバーをプロキシ化する必要がなくなるためサーバー ファームの維持費が削減できるという追加の利益ももたらします。

Beta 1 の開発では、cross site XMLHttpRequest (英語) とアクセス制御フレームワークを用いたサード パーティのクロス ドメイン アクセスに関する多くのセキュリティ的な懸案事項がありました。Beta 1 の公開後、W3C のアクセス制御フレームワークに関するサーバー側のエクスペリエンスとセキュリティを改善するため、他のブラウザーやW3C の face-to-face ミーティング出席者と作業する (英語) 機会に恵まれました。その結果、我々はXDR を、クライアント側で公開されているサード パーティのデータを匿名で要求するためのアクセス制御に関するセクションの文法と命令に明確に準拠するよう更新しました(セクション 5.1.3 in the Access Control Process Model (英語)) 。

Beta 1 からのXDR の更新により、Internet Explorer 8 では元のヘッダーを元の要求のシリアル化された値とともに送信することによってドメインのサーバーからのデータを要求することが可能になりました。IE8 Beta 2 は、Beta 1 の XDomainRequestAllowed: 1 ヘッダーによる許可に代えて、サーバーがAccess-Control-Allow-Origin: * を含む応答をした場合にだけ レスポンスを返します。他の変更点にはopen メソッドで相対パスをサポートすることと、送信先をHTTP と HTTPS に限定したアクセス制限が含まれます。

Cross-document Messaging (XDM) (英語)

Cross-document messaging (英語) はもうひとつ強力なクロス ドメイン 機能であることを以前ブログに書きました 。リモートの Web サービスへのバックエンド リクエストというよりも、Iframe ベースの " ガジェット" やコンポーネントが、Same Origin Policy へ の安全とは言えない侵害を行うことなく、 親ページと直接通信を行うことを可能にします。これにはパフォーマンスと信頼性が向上し、開発者にとってはブラウザー間の動作の違いや望ましくないサイド エフェクトへの対策を講じる必要がないという優位性もあります。この手法はさらにあなたのページにサード パーティ製のスクリプトを埋め込む必要をなくし、センシティブ情報( 例えばソーシャル ネットワークのプロファイルに関する情報など) を同意なしにサード パーティに公開してしまうような、潜在的な情報漏洩の脆弱性の機会を減少させます。

Beta 2 の更新には、HTML 5.0 ドラフトの更新により適切に適合するためにonmessage ハンドラーを document オブジェクトから window オブジェクトに移動することも含まれます。

window.attachEvent("onmessage", HandleMessage);

また e.URI を、シリアル化された " スキーム" + " ホスト" + " 既定値ではないポート" であるe.origin に置き換えました。 これは URI が、潜在的なセンシティブ情報を、受信者がアクセスの承諾や非承諾を決定する必要のないオリジン サイトから運び出せることに比べてはるかに安全です。

if (e.origin == 'https://www.contoso.com')
        {
               // process message text     
        }

最終的に、HTML 5.0 ドラフトも postMessage メソッドの targetOrigin パラメータを任意ではなく、必須のパラメータにするよう命じています。これはオリジンな<URL> またはワイルドカード <*> を指定することによるメッセージの送信先の明示的な通知が要求されるので、開発者が間違いを犯すことを困難にしています

frameOther.postMessage("This is a message", "http://example.com");

DOM ストレージ

現在、Web ページはローカルのコンピューターにデータを格納するためdocument.cookie プロパティを用いています。cookie の能力は、ドメイン毎に 50 組のキーと値のセットしか格納できないという現実に制限されています。 さらに、Cookie のプログラミング モデルは扱いにくく、データを取り出すためCookie 文字列全体を解析する必要があります。Cookie は 4KB までのチャンクをリクエスト ヘッダーに含めて送信することで、サーバーがクライアントの遷移状況や変更を記録するためにとても有用でしたが、Internet Explorer 8 は、クライアントの永続的なデータを含むシナリオと異なるタブのセッションの明示的な維持のための、より優れた代替案を提示します。W3C の HTML 5 DOM ストレージ オブジェクトはよりシンプルな、キーと値のペアの文字列データのための、グローバル ストレージ モデルとセッション ストレージ モデルを提供します。Web サイトはタブが存在している間、あるいはユーザーかWeb サイトが廃棄するまで、データを保存することができます。

Beta 2 の更新には、永続的な globalStorage 属性の名前を localStorage に変更することと、localStorage の記述にドメイン指定の必要がなくなることが含まれます。

// Store a key-value pair.
localStorage.setItem("FirstName","Sunava");

最終的に、ストレージの変更時に返されるonstorage HTML 5.0 イベントのアップデートへのサポート向上も含めました。ローカル ストレージに変更が加えられるとURI が返されるようになり、ページのハンドラーは元のウィンドウにソースを提供するだけでなく、ストレージ領域に追加する処理を誰が実行したのかを知ることができます。さらに良いニュースとして、HTML 5.0 の作業部会が Beta 1 に搭載したclear メソッドをドラフトに取り入れました。これは基本的にスクリプトによって、ストレージ領域にあるアクセス可能なすべてのアイテムをキーごとの繰り返しなしに消去することを可能にします。

Connectivity ( 接続性) イベント

navigator.onLine プロパティとonline / offline イベント は現在、Windows XP でもWindows Vista と同じように動作します。この動作は決してささいなことではなく、Windows XP での接続確認機能は、Windows Vista のように先進的ではありませんでした。とはいえこれは開発者にとって非常に有益なものであり、我々はOS の差異を心配する必要があってはならないと信じています。connectivity ( 接続性) イベントの価値は、ネットワークの切断が発生した場合にデータがキャッシュされているlocalstorage と共に使用された場合、特に魅力的です。

XMLHttpRequest

XDomainRequest オブジェクトを IE8 に導入するにあたり、同一ドメイン内の通信にとって最も重要なオブジェクトであり続けるXMLHttpRequest の継続的な調整と改良 から注意を逸らさないようにしました。Beta 1 の公開後、我々は意欲をもって、信頼性に関するいくつかのバグ修正と、Web Apps Working Group とともに行ったドラフト仕様の明確化と改良、およびそれへ準拠、さらにW3C の公開テスト ケースに集中しました。開発者の利便性のためにBeta 1 で導入された timeout method は、現在 XMLHttpRequest 仕様への採用についての評価が行われています。

// Sets timeout after open to two seconds.
xhr.timeout             = 2000;

ToStaticHTML 、JSON へ、JSON から

サード パーティから XDomainRequest かクロス ドキュメント メッセージングを用いた文字列が返ってきた場合、どのように処理しますか？　スクリプト インジェクションとクロス サイト スクリプティング （XSS ） の攻撃が増加している現在の世界には、安全なパーサーをくぐらせるという選択肢が、歓迎される救済策として登場しました。Eric Lawrence の IE8 のセキュリティについての投稿 Comprehensive Protection で詳細を説明した toStaticHTML は、潜在的に実行される可能性のあるコンテンツを取り除くことによって、文字列を無害化する強力な手段を提供します。

//Calling:
window.toStaticHTML("This is some <b>HTML</b> with embedded script following...<script>alert('bang!');</script>!");

//will return:
This is some <b>HTML</b> with embedded script following... !

さらに、Internet Explorer 8 Beta 2 の JSON.stringify とJSON.parse メソッドはJavascript による非ネイティブな serializers と deserializers に対して、パフォーマンスの強化を提供します。私たちの実装はDouglas Crockford の json2.js API (英語) を用いたネイティブな JSON ハンドリングである ECMAScript 3.1 proposal に基づいています。ネイティブ化することによるパフォーマンス的な利点に加え、一般的ではあるものの 、任意のスクリプト ファンクションの実行を許可する可能性を持つ危険なJSON オブジェクトの復元方法である eval() メソッドの安全な代替策を提供します。

その他の機能

AJAX ナビゲーションはBeta 1 から多少の変更を加えられました。Beta 2 用のいくつかの新しいコード サンプルを作成し、MSDN で概要を文書化しました。ホストごとのconnection parallelism （接続の並列化）もいくつかの調整を受けており、これについては今後の投稿で説明する予定です。

まとめ

開発者にとって AJAX エクスペリエンスがよりよいものとなるため、我々は標準化に取り組んでいます。Beta 2 の実装における変更点は既に述べた通りです。仕様草案の進展を含め、さまざまな事案においてW3C のメンバーとの連携を継続することで、前進し続けます。開発者にこれらの機能を採用していただけることを優先課題とし、これらの機能を統合したサイトへの移行の支援に集中して取り組んでいます。AJAX 機能セットのサンプル コードについては、IE8 AJAX Beta 2 Hands on Labs をご参照ください。最後に、AJAX コア開発チームとはどんな人なのかと思う方のために、ブログやメーリング リストに時々現れる名前を顔に当てはめられるよう写真( 未修正なので赤目もありますが) を掲載します。

ではお楽しみください。

Sunava Dutta
Program Manager

上段左から、Sharath Udupa （開発者）、Gideon Cohn ( テスター) 、Zhenbin Xu (AJAX シニア 開発者) 、Alex Kuang ( テスター) 、および Karen Anderson ( テスター)

下段左から Sunava Dutta ( プログラム マネージャー) とAhmed Kamel ( 開発者)

この写真には映っていないのは Françoise Louw ( テスター) 、Adrian Bateman ( プログラム マネージャー) 、および Gaurav Seth ( 開発者)

　

ページのトップへページのトップへ