OSDN Git Service

c839724f0d9ced5e832086b988e64e9b9d2fe024
[pettanr/clientJs.git] / 0.6.x / js / 04_net / 01_XNetXHR.js
1 // https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest\r
2 // https://web.archive.org/web/20071101021832/http://web.paulownia.jp/script/ajax/xmlhttp4.html\r
3 // https://web.archive.org/web/20091029170015/http://wiki.paulownia.jp/ajax/xmlhttprequest\r
4 /* \r
5  * http://ponpon-village.net/ajax/xmlhttp.htm\r
6  * IE のバージョンによっては、ActiveXObject("Msxml2.XMLHTTP.5.0") , ActiveXObject("Msxml2.XMLHTTP.4.0") ,\r
7 ActiveXObject("Msxml2.XMLHTTP.3.0") , ActiveXObject("Msxml2.XMLHTTP") なども使用出来る。\r
8 \r
9 http://vird2002.s8.xrea.com/javascript/XMLHttpRequest.html\r
10 // --- 使うべきオブジェクト\r
11 new ActiveXObject( 'Msxml2.XMLHTTP.3.0' ); // バージョン3.0 広範に利用されているので、今後も bugfix を行う\r
12 new ActiveXObject( 'Msxml2.XMLHTTP.6.0' ); // バージョン6.0 は最新版なので bugfix を続ける\r
13 \r
14 // --- 使うべきではないオブジェクト\r
15 new ActiveXObject( 'Microsoft.XMLHTTP' );  // Microsoft接頭辞は古いので指定すべきではない\r
16 new ActiveXObject( 'Msxml.XMLHTTP' );      // Msxml2接頭辞を指定すべき\r
17 new ActiveXObject( 'Msxml2.XMLHTTP' );     // バージョンを省略すると 3.0 として扱われるので、バージョンは明記すべき\r
18 new ActiveXObject( 'Msxml2.XMLHTTP.4.0' ); // バージョン4.0 は bugfix が行われないので、3.0 か 6.0 を指定すべき\r
19 new ActiveXObject( 'Msxml2.XMLHTTP.5.0' ); // バージョン5.0 は bugfix が行われないので、3.0 か 6.0 を指定すべき\r
20 \r
21  */\r
22 var X_Net_XHR_W3C      = window[ 'XMLHttpRequest' ] && new XMLHttpRequest(),\r
23         X_Net_XHR_X_DOMAIN = window[ 'XDomainRequest' ] && new XDomainRequest(),\r
24         X_Net_XHR_VERSION  = 0,\r
25         X_Net_XHR_ACTIVE_X = 5 <= X.UA.IE && X.UA.IE < 8 && X.UA.ActiveX && ( new Function( [\r
26                 'var x=".XMLHTTP",',\r
27                         'm="MSXML2"+x,',\r
28                         'v=[m+".6.0",m+".3.0",m+".5.0",m+".4.0",m,"Microsoft"+x],',\r
29                         'i=-1;',\r
30                 'for(;i<5;){',\r
31                         'try{',\r
32                                 'return[++i,new ActiveXObject(v[i])];',\r
33                         '}catch(e){}',\r
34                 '}'\r
35         ].join( '' ) ) )();\r
36 \r
37 if( X_Net_XHR_ACTIVE_X ){\r
38         X_Net_XHR_VERSION  = [ 6, 3, 5, 4, 2, 1 ][ X_Net_XHR_ACTIVE_X[ 0 ] ];\r
39         X_Net_XHR_ACTIVE_X = X_Net_XHR_ACTIVE_X[ 1 ];\r
40 };\r
41 \r
42 X.Net.XHR = {\r
43         // Opera7.6+, Safari1.2+, khtml3.?+, Gecko0.9.7+\r
44         W3C         : !!X_Net_XHR_W3C,\r
45 \r
46         X_DOMAIN    : !!X_Net_XHR_X_DOMAIN,\r
47 \r
48         ACTIVE_X    : !!X_Net_XHR_ACTIVE_X,\r
49 \r
50 /*\r
51  * http://hakuhin.jp/as/import.html\r
52  * ファイルの読み込みについて\r
53  * http://hakuhin.jp/as/javascript.html\r
54  * Flash から JavaScript にアクセスする\r
55  */\r
56         FLASH       : false,\r
57         \r
58 \r
59 // ie7 ではローカルリソースには ActiveX の XHR を使う\r
60 \r
61 // https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest\r
62 // Progress Events      Chrome7, firefox3.5, ie10, opera12, Safari?, Chrome for Android 0.16\r
63         PROGRESS    : false, //\r
64 \r
65         UL_PROGRESS : false,\r
66 \r
67         CANCELABLE  : false,\r
68         \r
69         TIMEOUT     : false\r
70 \r
71 };\r
72 \r
73 if( X.Net.XHR.W3C || X_Net_XHR_ACTIVE_X ){\r
74         \r
75         X_NET_XHRWrapper = X.Class._override(\r
76                 new X.EventDispatcher(),\r
77                 {\r
78                                                 \r
79                         _rawObject    : X_Net_XHR_W3C || X_Net_XHR_ACTIVE_X,\r
80                         _isXHR        : true,\r
81                         _isXDR        : false, // for ie8\r
82                         \r
83                         _method       : '',\r
84                         _type         : '',\r
85                         _busy         : false,\r
86                         _canceled     : false,\r
87                         _lastProgress : 0,\r
88                         \r
89                         load : function( obj ){\r
90                                 var raw      = X_NET_XHRWrapper._rawObject,\r
91                                         method   = obj[ 'method' ],\r
92                                         url      = obj[ 'url' ],\r
93                                         async    = obj[ 'async' ],\r
94                                         user     = obj[ 'user' ],\r
95                                         password = obj[ 'password' ],\r
96                                         headers  = obj[ 'headers' ],\r
97                                         postbody = obj[ 'postbody' ],\r
98                                         timeout  = obj[ 'timeout' ],\r
99                                         temp;\r
100                                 \r
101                                 if( obj[ 'type' ] ){\r
102                                         this._type = obj[ 'type' ];\r
103                                 } else {\r
104                                         temp = url.split( '#' )[ 0 ].split( '?' )[ 0 ].split( '.' );\r
105                                         if( 2 <= temp.length ){\r
106                                                 this._type = temp[ temp.length - 1 ].toLowerCase();\r
107                                         };\r
108                                 };\r
109                                 \r
110                                 if( X_Net_XHR_X_DOMAIN ){\r
111                                         if( false /* isXDomain( url ) */ ){ // isXDomain\r
112                                                 //if( raw !== X_Net_XHR_X_DOMAIN ){\r
113                                                         X_EventDispatcher_migrateEvent( this );\r
114                                                         X_NET_XHRWrapper._rawObject = X_Net_XHR_X_DOMAIN;\r
115                                                         X_EventDispatcher_restoreEvent( this );\r
116                                                 //};\r
117                                         } else {\r
118                                                 //if( raw === X_Net_XHR_X_DOMAIN ){\r
119                                                         X_EventDispatcher_migrateEvent( this );\r
120                                                         X_NET_XHRWrapper._rawObject = X_Net_XHR_W3C || X_Net_XHR_ACTIVE_X;\r
121                                                         X_EventDispatcher_restoreEvent( this);\r
122                                                 //};\r
123                                         };\r
124                                 };\r
125                                 //if( raw.timeout !== undefined ) raw.timeout = timeout || -1;\r
126                                 raw.open( method, url, false );\r
127                                 \r
128                                 // http://www.quirksmode.org/blog/archives/2005/09/xmlhttp_notes_r_1.html\r
129                                 // raw.overrideMimeType()\r
130                                 if( !X_Net_XHR_ACTIVE_X && X.Type.isFunction( raw.setRequestHeader ) ){\r
131                                         for( p in headers ){\r
132                                                 raw.setRequestHeader( p, headers[ p ] ); // Opera8.01+, MSXML3+\r
133                                         };              \r
134                                 };\r
135                                 \r
136                                 // send 前にフラグを立てる,回線が早いと raw.send() 内で onload -> _busy = false ののち、 _busy = true するケースがあるため。\r
137                                 this._busy = true;\r
138                                 \r
139                                 // http://allabout.co.jp/gm/gc/24097/#1\r
140                                 // sendをonreadystatechangeの前に記述すると、ieでは動作しなくなります、、、。\r
141                                 // konquerorでエラーが発生するのでここでは、とりあえず、send('') としました。\r
142                                 raw.send( postbody || '' );\r
143                         },\r
144                         \r
145                         cancel : X.Net.XHR.CANCELABLE ?\r
146                                 function(){\r
147                                         //X_NET_XHRWrapper._rawObject.abort()\r
148                                 } :\r
149                                 function(){\r
150                                         this._canceled = true;\r
151                                 },\r
152                         \r
153                         reset : function(){\r
154                                 this._method       = this._type = null;\r
155                                 this._canceled     = this._busy = false;\r
156                                 this._lastProgress = 0;\r
157                         },\r
158                         \r
159                         handleEvent : function( e ){\r
160                                 var raw  = X_NET_XHRWrapper._rawObject,\r
161                                         live = !this._canceled,\r
162                                         status, data;\r
163                                 console.log( '-- ' + e.type );\r
164                                 switch( e.type ){\r
165                                         /*\r
166                                          * http://memopad.bitter.jp/w3c/ajax/ajax_xmlhttprequest_onreadystatechange.html\r
167                                         readyState      XMLHttpRequest のステータスを保持する。0 から 4 までに変化する:\r
168                                         0: リクエストは初期化されていない\r
169                                         1: サーバ接続は確立した\r
170                                         2: リクエストを受信した\r
171                                         3: リクエストの処理中\r
172                                         4: リクエストは終了してレスポンスの準備が完了\r
173                                         status  200: "OK"\r
174                                         404: Page not found\r
175                                         \r
176                                         If-Modified-Sinceヘッダを利用してWebページのキャッシュを行うXMLHttpRequestラッパー\r
177                                         http://www.semblog.org/msano/archives/000407.html\r
178                                         * */            \r
179                                         case 'readystatechange' :\r
180                                                 if( !X.Net.XHR.PROGRESS ){\r
181                                                         switch( raw.readyState ){\r
182                                                                 case 0 :\r
183                                                                 case 1 :\r
184                                                                         return;\r
185                                                                 case 2 : // 0.01%\r
186                                                                         live && this.asyncDispatch( 0, { type : X.Event.PROGRESS, percent : 0.01 } );\r
187                                                                         return;\r
188                                                                 case 3 :\r
189                                                                         live && this.asyncDispatch( 0, { type : X.Event.PROGRESS, percent : this._lastProgress < 99.9 ? 99.9 : ( this._lastProgress + 100 ) / 2 } );\r
190                                                                         // 99.9%\r
191                                                                         return;\r
192                                                                 case 4 :\r
193                                                                         if( this._lastProgress === 100 ) return; // Opera8 readystatechange が2重に発生\r
194                                                                         // 100%\r
195                                                                         break; // load へ\r
196                                                                 default :\r
197                                                                         // error\r
198                                                                         return;\r
199                                                         };                                              \r
200                                                 };\r
201         \r
202                                         case 'load' :\r
203                                                 \r
204                                                 if( !live ){\r
205                                                         this.reset();\r
206                                                         return;\r
207                                                 };\r
208                                                 if( this._lastProgress === 100 ) return;\r
209                                                 \r
210                                                 \r
211                                                 this._lastProgress = 100;\r
212                                                 \r
213                                                 \r
214                                                 status = raw.status;\r
215                                                 \r
216                                                 // https://code.google.com/p/fakeworker-js/source/browse/src/javascript/fakeworker.js\r
217                                                 if(\r
218                                                         ( !status && location.protocol === 'file:' ) ||\r
219                                             ( 200 <= status && status < 300 ) ||\r
220                                             status === 304 ||\r
221                                             status === 1223 ||\r
222                                             ( X.UA.Webkit && status === undefined ) // safari: /webkit/.test(userAgent)\r
223                                                 ){\r
224                                                         /*\r
225                                                          * opera8, safari2, khtml3 で utf8 日本語文字列の文字化け\r
226                                                          */\r
227                                                         // raw.getAllResponseHeaders();\r
228                                                         \r
229                                                         // parse json, html, xml, text, script, css\r
230                                                         switch( this._type ){\r
231                                                                 case '' :\r
232                                                                 case 'text' :\r
233                                                                         data = raw[ 'responseText' ];\r
234                                                                         break;\r
235                                                                 case 'json' :\r
236                                                                 case 'moz-json' :\r
237                                                                         data = raw[ 'response' ] || raw[ 'responseText' ]; // とりあえず\r
238                                                                         break;\r
239                                                                 case 'document' :\r
240                                                                 case 'xml' :\r
241                                                                 case 'html' :\r
242                                                                 case 'htm' :\r
243                                                                         data = raw[ 'responseXML' ];\r
244                                                                         break;\r
245                                                                 case 'blob' :\r
246                                                                 case 'arraybuffer' :\r
247                                                                         data = raw[ 'response' ] || raw[ 'responseText' ]; // とりあえず\r
248                                                                         break;\r
249                                                         };\r
250                                                         \r
251                                                         //console.log( 'status ' + status );\r
252                                                         //console.dir( raw );\r
253                                                         \r
254                                                         this._busy = false;\r
255                                                         this.asyncDispatch( 0, { type : X.Event.SUCCESS, status : status || 200, data : data } );                                                       \r
256                                                 } else {\r
257                                                         console.log( 'status ' + status );\r
258                                                         this._busy = false;\r
259                                                         //console.dir( raw );\r
260                                                         live && this.asyncDispatch( 0, { type : X.Event.ERROR, status : raw.status || 0, percent : 100 } );\r
261                                                 };\r
262                                                 break;\r
263                                         \r
264                                         case 'progress' :\r
265                                                 if( e.lengthComputable ){\r
266                                                         this._lastProgress = e.loaded / e.total;\r
267                                                         live && this.asyncDispatch( 0, { type : X.Event.PROGRESS, percent : this._lastProgress } );\r
268                                                 };\r
269                                                 break;\r
270                                         \r
271                                         case 'error' :\r
272                                         //console.dir( e );\r
273                                                 this._busy = false;\r
274                                                 live && this.asyncDispatch( 0, { type : X.Event.ERROR, status : raw.status } );\r
275                                                 break;\r
276                                         \r
277                                         //case 'abort' :\r
278                                         //      this._busy = false;\r
279                                         //      this.asyncDispatch( 0, { type : X.Event.ERROR, status : raw.status } );\r
280                                         //      break;\r
281                                         case 'timeout' : // Gecko 12.0 https://developer.mozilla.org/ja/docs/XMLHttpRequest/Synchronous_and_Asynchronous_Requests\r
282                                                 this._busy = false;\r
283                                                 live && this.asyncDispatch( 0, { type : X.Event.ERROR, status : raw.status } );\r
284                                                 break;\r
285                                 };\r
286                         },\r
287                         \r
288                         onUploadProgress : X.Net.XHR.UL_PROGRESS && function( e ){\r
289                                 var raw  = X_NET_XHRWrapper._rawObject.upload,\r
290                                         live = !this._canceled,\r
291                                         states, data;\r
292                         }\r
293                 },\r
294                 true\r
295         );\r
296         // 同期リクエストでなければならない場合, unload, beforeunload時\r
297 \r
298 \r
299         // ie8 では timeout が有効, MSXML のバージョンで決定すべき?\r
300         if( X.UA.IE8 ){\r
301                 X_NET_XHRWrapper.listen( [ 'readystatechange', 'error', 'abort', 'timeout' ] );\r
302         } else\r
303         if( X.UA.IE7 ){\r
304                 X_NET_XHRWrapper.listen( [ 'readystatechange', 'error' ] );\r
305         } else\r
306         if( X_Net_XHR_ACTIVE_X ){ // win ie5-6\r
307                 X_NET_XHRWrapper.listen( [ 'readystatechange' ] );\r
308         } else \r
309         if( X.Net.XHR.PROGRESS ){\r
310                 X_NET_XHRWrapper.listen( [ 'load', 'progress', 'error', 'abort', 'timeout' ] );\r
311         } else {\r
312                 X_NET_XHRWrapper.listen( [ 'load', 'readystatechange', 'error', 'abort', 'timeout' ] );\r
313         };\r
314         \r
315         if( X.Net.XHR.UL_PROGRESS ){\r
316                 X_NET_XHRWrapper._rawObject.upload.addEventListener( 'progress', X.Net.XHR.xhr.onUploadProgress );\r
317         };\r
318 };\r
319 \r