XMLHttpRequestオブジェクトを取得するには？

Ajax で重要な役割を果たす XMLHttpRequest オブジェクトですが、 IE 7 からはネイティブオブジェクトとしてして提供されます。 しかし、当面はネイティブオブジェクトを持たない IE 6 が高いシェアを維持することでしょう。

本稿では、IE 7 のネイティブオブジェクトを使用することを前提にしたクロスブラウザ対策を考えて見ます。

まずは、ブラウザの実装について調べた結果を次の表にまとめました。 この調査には「ブラウザ実装診断ツール」を使用しました。

この結果から、クロスブラウザ対策は次のようにすると良いでしょう。

• window.XMLHttpRequest が function または object の場合は何もしない。
• window.XMLHttpRequest が undefined の場合は、代替可能な ActiveXObject を探す。 優先順位は Msxml2.XMLHTTP (高)、Microsoft.XMLHTTP (低) とする。 代替可能な ActiveXObject を見つけたら、 window.XMLHttpRequest にその ActiveXObject を返すコンストラクタを実装する。

これを実現するコードは次のようになります。 このコードが実行された後であれば、ブラウザが何であるかを気にすることなく、 XMLHttpRequest オブジェクトを取得することができます。

if (typeof window.XMLHttpRequest == "undefined") {
    if (typeof window.ActiveXObject == "function") {
        try {
            new ActiveXObject("Msxml2.XMLHTTP");
            window.XMLHttpRequest = function()
            {
                return new ActiveXObject("Msxml2.XMLHTTP");
            }
        }
        catch (e) {
            try {
                new ActiveXObject("Microsoft.XMLHTTP");
                window.XMLHttpRequest = function()
                {
                    return new ActiveXObject("Microsoft.XMLHTTP");
                }
            }
            catch (e) {
                // 試行を断念する
            }
        }
    }
    // else if (未知のブラウザ) { }
}
// else { /* Firefox, Opera, IE7 は何もしなくて良い */ }

XMLHttpRequest オブジェクトを取得するコードは、次の2つの記法のどちらでも問題ありません。

• new window.XMLHttpRequest()
• new XMLHttpRequest()