[jQuery] $ajaxと戯れたのでメモ。

upload.js

  	var fData = new FormData($('form')[0]);
		$.ajax({
			url: url,
			type: "post",
			data:fData,
			contentType: false,
			processData: false,
		})
		//.done(function(data, textStatus, jqXHR){
		.complete(function(){
      alert('end file upload!')
			uploadEndCallback();
		}());
    

あらすじ

別ドメインにたいしてFileのUploadを行うつもりだったがcallbackがとれない。
callbackをとるため、jQueryのajaxを利用しようと考えた。


するとsame-origin policyにひっかかり、callbackがもらえない。。。
はてさてどうしたもんか。

するとCross-site HTTP requestsなるものがあることを発見。
要は responseHeader に Access-Control-Allow-Origin: *　を追加することで、別ドメインのjavascriptを実行することができるよ。というもの。
詳細は下記。

■ MOZILLA DEVELOPER NETWORK HTTP access control (CORS)
https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS?redirectlocale=en-US&redirectslug=HTTP_access_control
■ W3C Cross-Origin Resource Sharing
http://www.w3.org/TR/cors/

じゃあ、実際どうやってcallbackをうけとるの？というのが upload.js の内容。
　　*　記述はこれであっているはずなのに、実際にはなぜか値が functionの引数が undefined　になった。。。  


こんな内容を図入りでまとめてあるのが下記のブログ。S3の話になっているけど、コードに関してはIEのXDomainRequestに関する話題にも触れていて良いと思う。
ただし、Fileのuploadの場合、 success でなく、done か completeで受けないと、本当にファイルの転送	が終わる前にcallbackが実行されてしまったので、
そこは修正が必要。

■クラスメソッド開発ブログ CORS(Cross-Origin Resource Sharing)によるクロスドメイン通信の傾向と対策
http://dev.classmethod.jp/cloud/cors-cross-origin-resource-sharing-cross-domain/



追記
FormData オブジェクトを jQuery で送信する
http://blog.sarabande.jp/post/30694191998

jQuery API ajax と done 
http://api.jquery.com/deferred.done/
http://api.jquery.com/jQuery.ajax/
後半、The jqXHR Objectの項目にfunctionのパラメータも書かれている。
jqXHR.done(function(data, textStatus, jqXHR) {});