dojoのXhrIframeProxyでプロキシサービスを使わずにクロスドメインXML取得

以前にここで触れた
http://d.hatena.ne.jp/shinichitomita/20060803/1154609128
について、最近0.4.0でパッケージに正式に含まれたらしいので、ちょっと試してみる。

テスト内容

http://stomita.web.fc2.com/xip_test.html
から、サイトの外にある
http://www.geocities.jp/stormriders999/fruits.xml
のデータを取得し、表示

セットアップ

  • dojo 0.4.0をダウンロード

http://download.dojotoolkit.org/release-0.4.0/dojo-0.4.0-ajax.zip

  • 圧縮ファイルを展開し、dojo-0.4.0/src/io/xip_server.html を http://www.geocities.jp/stormriders999/ にアップロード。ただし、以下の点を変更しないと動かなかった。たぶんFirefoxがlocation.hashで勝手にURLデコードをしてしまうため。
122c122
<   xipClientUrl = decodeURIComponent(window.location.hash.substring(1, window.location.hash.length));
---
>   xipClientUrl = decodeURIComponent(window.location.href.replace(/^.*#(.*)$/, '$1'));
function isAllowedRequest(request){
  // only GET request from stomita.web.fc2.com is allowed.
  return (xipClientUrl.indexOf("http://stomita.web.fc2.com/")==0 &&
          request.method == "GET")
}
<?xml version="1.0"?>
<fruits>
    <fruit>
        <name>apple</name>
        <size>XS</size>
        <color>red</color>
    </fruit>
    <fruit>
        <name>banana</name>
        <size>S</size>
        <color>yellow</color>
    </fruit>
    <fruit>
        <name>melon</name>
        <size>XS</size>
        <color>green</color>
    </fruit>
</fruits>
<html>
  <head>
    <title>dojo XhrIframeProxy test</title>
    <script type="text/javascript" src="./js/dojo/dojo.js"></script>
    <script type="text/javascript">
      dojo.require("dojo.io.*");
      dojo.require("dojo.io.XhrIframeProxy");
    </script>
  </head>
  <body>
    <script type="text/javascript">
      function getXML(url) {
        dojo.io.bind({
          iframeProxyUrl: 'http://www.geocities.jp/stormriders999/xip_server.html',
          url: url,
          load: function(type, data, event, kwArgs) {
            alert(data);
          }
        });
      }
    </script>

    <input type="text" id="xmlUrl" value="http://www.geocities.jp/stormriders999/fruits.xml" size="80" /><br />
    <input type="button" onclick="javascript:getXML(document.getElementById('xmlUrl').value)" value="Get XML" />

    <div id="result"></div>
  </body>
</html>

所感

良い点
  • Flashでのクロスドメイン通信と違い、crossdomain.xmlサーバルートにおく必要がない。xip_server.htmlはデータと同一のドメインならどこに置いてもいい。
  • isAllowed.jsで許認可のためのロジックを記述できるので、crossdomain.xmlに比べポリシー設定がきめ細かくできる。
懸念点
  • IEでリクエストのたびにクリック音が発生。気にならないならOK。
  • IFRAMEを二重に使うため、リソース消費が大きくなる?かも。
  • タイマーを使ってfragment identifier(URLの#以降)を監視するため若干遅延する可能性。
  • 巨大データの取り扱いについてまだ未知数。

あ、あとdojoが大きすぎ ^^;


(追記)
IEのクリック音、Onにしてテストしてみたら、巨大データを通信するときに狂ったように連打しだした。まあ面白いがこれはどうよ。