今日の罠 - うなの日記

最近はdojoを使っているわけですが、FireFoxでモジュールのロードがうまくいかず迷走。

現象

IEでは動作するのにFireFoxだとモジュールのロードがうまくいかない。
FireFoxでもWebサーバーに上げると動作する。ローカルに置いたHTMLをドラッグドロップでFireFoxに読み込ませるとエラーになる。

原因

いろいろ調べてみると、どうもFireFoxでのローカルファイルのGet制限に引っかかっている様子。

dojoではモジュールのロードはXHRでスクリプトをGETして読み込むようになっているが、
FireFoxでは、スクリプトを含むHTMLファイルより上位ディレクトリのファイルをXHRで読もうとするとエラーになる。
- HTMLと同じディレクトリやより下位のディレクトリにあるファイルはロード可能。
- 制約はローカルのみ。ファイル一式をWebサーバーにアップロードすると問題ない。

検証コード

検証で使用したコードは以下。

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
  <script type="text/javascript" src="./jquery-1.3.2.js"></script> 
  <script type="text/javascript">
  function load( file ){
    $.ajax( { 
      url:file, 
      success: function(result){
        $("#stdout").append( file + " の読み込み完了 " + result + "<br/>" );
      },
      error: function(){
        $("#stdout").append( file + " の読み込み失敗 <br/>" );
      }
    });
  }
  function main() {
    load( "../test.txt" );
    load( "./test.txt" );
    load( "./cc/test.txt" );
  }
  </script>
</head>
<body onload="javascript:main();">
  <div id=stdout></div>
</body>
</html>

FireFoxかつローカルだと、"../test.txt"のロードだけ失敗します。んー、6時間ロス。