クロス開発してみよう！PhoneGap3＋jQuery.ajax＋iOS でハマった

公開状態にした Google Spreadsheet からデータを取得しようとして下記のコードを書いた。

<script>
$(document).ready(function(){
 // ドキュメントを開いた時にボタンクリックのハンドラを登録
 $("#button").click( function() {
  $.ajax({
   url: "http://spreadsheets.google.com/feeds/cells/xxxxxxxxxx/1/public/basic",
   dataType: "jsonp",
   data: { "alt" : "json-in-script" },
   success:  function(data) { alert("成功"); },
   error: function(xhr, options, error) { alert(error); }
  });
 });
});
</script>

何が問題？

Mac上のChromeやSafariでは問題なく動作する
しかし PhoneGap → iPhone Simulator で動かすと ajax()を呼んだ直後に error callbackが呼ばれる。
errorのメッセージは、「JQuery8888888_88888 was not called」みたいな感じ。 

修正（回避？）方法

結論からいうと、PhoneGap3の場合、次のようにすると直った 

1. iPhone Simulator上の古いアプリを削除する 
2. platforms/iosフォルダを削除する 
3. www/config.xml の中の accessタグを探して <access origin="*" /> に変更する
4. ビルドして実行

注意！

• PhoneGap2のときは、platforms/ios/AppName/Cordova.plist を編集すればOKだったみたいだが、PhoneGap3ではそのファイルは無くなっている
• セキュリティを考慮して、<access origin="*.google.com" /> のようにアクセス先を限定すると動作しない。要調査だがひとまず保留。