|
@@ -6,6 +6,7 @@ import RNFetchBlob from '../index.js'
|
6
|
6
|
import XMLHttpRequestEventTarget from './XMLHttpRequestEventTarget.js'
|
7
|
7
|
import Log from '../utils/log.js'
|
8
|
8
|
import Blob from './Blob.js'
|
|
9
|
+import ProgressEvent from './ProgressEvent.js'
|
9
|
10
|
|
10
|
11
|
const log = new Log('XMLHttpRequest')
|
11
|
12
|
|
|
@@ -21,31 +22,43 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
21
|
22
|
|
22
|
23
|
_onreadystatechange : () => void;
|
23
|
24
|
|
|
25
|
+ upload : XMLHttpRequestEventTarget = new XMLHttpRequestEventTarget();
|
|
26
|
+
|
|
27
|
+ // readonly
|
24
|
28
|
_readyState : number = UNSENT;
|
25
|
29
|
_response : any = '';
|
26
|
|
- _responseText : any = '';
|
|
30
|
+ _responseText : any = null;
|
27
|
31
|
_responseHeaders : any = {};
|
28
|
32
|
_responseType : '' | 'arraybuffer' | 'blob' | 'document' | 'json' | 'text' = '';
|
29
|
|
- // TODO : not suppoted for now
|
|
33
|
+ // TODO : not suppoted ATM
|
30
|
34
|
_responseURL : null = '';
|
31
|
35
|
_responseXML : null = '';
|
32
|
36
|
_status : number = 0;
|
33
|
37
|
_statusText : string = '';
|
34
|
38
|
_timeout : number = 0;
|
35
|
|
- _upload : XMLHttpRequestEventTarget;
|
36
|
39
|
_sendFlag : boolean = false;
|
|
40
|
+ _uploadStarted : boolean = false;
|
37
|
41
|
|
38
|
42
|
// RNFetchBlob compatible data structure
|
39
|
|
- _config : RNFetchBlobConfig;
|
|
43
|
+ _config : RNFetchBlobConfig = {};
|
40
|
44
|
_url : any;
|
41
|
45
|
_method : string;
|
42
|
|
- _headers: any;
|
|
46
|
+ _headers: any = {
|
|
47
|
+ 'Content-Type' : 'text/plain'
|
|
48
|
+ };
|
43
|
49
|
_body: any;
|
44
|
50
|
|
45
|
51
|
// RNFetchBlob promise object, which has `progress`, `uploadProgress`, and
|
46
|
52
|
// `cancel` methods.
|
47
|
53
|
_task: any;
|
48
|
54
|
|
|
55
|
+ // constants
|
|
56
|
+ get UNSENT() { return UNSENT }
|
|
57
|
+ get OPENED() { return OPENED }
|
|
58
|
+ get HEADERS_RECEIVED() { return HEADERS_RECEIVED }
|
|
59
|
+ get LOADING() { return LOADING }
|
|
60
|
+ get DONE() { return DONE }
|
|
61
|
+
|
49
|
62
|
static get UNSENT() {
|
50
|
63
|
return UNSENT
|
51
|
64
|
}
|
|
@@ -66,12 +79,9 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
66
|
79
|
return DONE
|
67
|
80
|
}
|
68
|
81
|
|
69
|
|
- constructor(...args) {
|
|
82
|
+ constructor() {
|
70
|
83
|
super()
|
71
|
|
- log.verbose('XMLHttpRequest constructor called', args)
|
72
|
|
- this._config = {}
|
73
|
|
- this._args = {}
|
74
|
|
- this._headers = {}
|
|
84
|
+ log.verbose('XMLHttpRequest constructor called')
|
75
|
85
|
}
|
76
|
86
|
|
77
|
87
|
|
|
@@ -89,7 +99,7 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
89
|
99
|
this._method = method
|
90
|
100
|
this._url = url
|
91
|
101
|
this._headers = {}
|
92
|
|
- this.readyState = XMLHttpRequest.OPENED
|
|
102
|
+ this._dispatchReadStateChange(XMLHttpRequest.OPENED)
|
93
|
103
|
}
|
94
|
104
|
|
95
|
105
|
/**
|
|
@@ -105,23 +115,22 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
105
|
115
|
log.verbose('XMLHttpRequest send ', body)
|
106
|
116
|
let {_method, _url, _headers } = this
|
107
|
117
|
log.verbose('sending request with args', _method, _url, _headers, body)
|
108
|
|
-
|
109
|
|
- this._upload = new XMLHttpRequestEventTarget()
|
110
|
118
|
log.verbose(typeof body, body instanceof FormData)
|
111
|
119
|
|
112
|
120
|
if(body instanceof Blob) {
|
113
|
121
|
body = RNFetchBlob.wrap(body.getRNFetchBlobRef())
|
114
|
122
|
}
|
|
123
|
+ else if(typeof body === 'object') {
|
|
124
|
+ body = JSON.stringify(body)
|
|
125
|
+ }
|
115
|
126
|
|
116
|
|
- this.dispatchEvent('loadstart')
|
117
|
|
- if(this.onloadstart)
|
118
|
|
- this.onloadstart()
|
119
|
|
-
|
120
|
|
- this._task = RNFetchBlob.config({ auto: true })
|
121
|
|
- .fetch(_method, _url, _headers, body)
|
|
127
|
+ this._task = RNFetchBlob
|
|
128
|
+ .config({ auto: true, timeout : this._timeout })
|
|
129
|
+ .fetch(_method, _url, _headers, body)
|
|
130
|
+ this.dispatchEvent('load')
|
122
|
131
|
this._task
|
123
|
132
|
.stateChange(this._headerReceived.bind(this))
|
124
|
|
- .uploadProgress(this._progressEvent.bind(this))
|
|
133
|
+ .uploadProgress(this._uploadProgressEvent.bind(this))
|
125
|
134
|
.progress(this._progressEvent.bind(this))
|
126
|
135
|
.catch(this._onError.bind(this))
|
127
|
136
|
.then(this._onDone.bind(this))
|
|
@@ -129,12 +138,12 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
129
|
138
|
|
130
|
139
|
overrideMimeType(mime:string) {
|
131
|
140
|
log.verbose('XMLHttpRequest overrideMimeType', mime)
|
132
|
|
- this._headers['content-type'] = mime
|
|
141
|
+ this._headers['Content-Type'] = mime
|
133
|
142
|
}
|
134
|
143
|
|
135
|
144
|
setRequestHeader(name, value) {
|
136
|
145
|
log.verbose('XMLHttpRequest set header', name, value)
|
137
|
|
- if(this._readyState !== OPENED && this._sendFlag) {
|
|
146
|
+ if(this._readyState !== OPENED || this._sendFlag) {
|
138
|
147
|
throw `InvalidStateError : Calling setRequestHeader in wrong state ${this._readyState}`
|
139
|
148
|
}
|
140
|
149
|
// UNICODE SHOULD NOT PASS
|
|
@@ -199,29 +208,36 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
199
|
208
|
_headerReceived(e) {
|
200
|
209
|
log.verbose('header received ', this._task.taskId, e)
|
201
|
210
|
this.responseURL = this._url
|
|
211
|
+ this.upload.dispatchEvent('loadend')
|
|
212
|
+ this.dispatchEvent('load')
|
202
|
213
|
if(e.state === "2") {
|
203
|
|
- this._readyState = XMLHttpRequest.HEADERS_RECEIVED
|
204
|
214
|
this._responseHeaders = e.headers
|
205
|
|
- this._responseText = e.status
|
|
215
|
+ this._statusText = e.status
|
206
|
216
|
this._responseType = e.respType || ''
|
207
|
217
|
this._status = Math.floor(e.status)
|
|
218
|
+ this._dispatchReadStateChange(XMLHttpRequest.HEADERS_RECEIVED)
|
208
|
219
|
}
|
209
|
220
|
}
|
210
|
221
|
|
|
222
|
+ _uploadProgressEvent(send:number, total:number) {
|
|
223
|
+ console.log('_upload', this.upload)
|
|
224
|
+ if(!this._uploadStarted) {
|
|
225
|
+ this.upload.dispatchEvent('loadstart')
|
|
226
|
+ this._uploadStarted = true
|
|
227
|
+ }
|
|
228
|
+ if(send >= total)
|
|
229
|
+ this.upload.dispatchEvent('load')
|
|
230
|
+ this.upload.dispatchEvent('progress', new ProgressEvent(true, send, total))
|
|
231
|
+ }
|
|
232
|
+
|
211
|
233
|
_progressEvent(send:number, total:number) {
|
212
|
234
|
log.verbose(this.readyState)
|
213
|
|
- if(this.readyState === XMLHttpRequest.HEADERS_RECEIVED)
|
214
|
|
- this.readyState = XMLHttpRequest.LOADING
|
|
235
|
+ if(this._readyState === XMLHttpRequest.HEADERS_RECEIVED)
|
|
236
|
+ this._dispatchReadStateChange(XMLHttpRequest.LOADING)
|
215
|
237
|
let lengthComputable = false
|
216
|
|
- let e = { lengthComputable }
|
217
|
238
|
if(total && total >= 0)
|
218
|
|
- e.lengthComputable = true
|
219
|
|
- else {
|
220
|
|
- Object.assign(e, { loaded : send, total })
|
221
|
|
- }
|
222
|
|
-
|
223
|
|
- if(this.onprogress)
|
224
|
|
- this.onprogress(e)
|
|
239
|
+ lengthComputable = true
|
|
240
|
+ let e = new ProgressEvent(lengthComputable, send, total)
|
225
|
241
|
this.dispatchEvent('progress', e)
|
226
|
242
|
}
|
227
|
243
|
|
|
@@ -230,46 +246,51 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
230
|
246
|
this._statusText = err
|
231
|
247
|
this._status = String(err).match(/\d+/)
|
232
|
248
|
this._status = this._status ? Math.floor(this.status) : 404
|
233
|
|
- this._readyState = XMLHttpRequest.DONE
|
234
|
|
- if(String(err).match('timeout') !== null) {
|
|
249
|
+ this._dispatchReadStateChange(XMLHttpRequest.DONE)
|
|
250
|
+ if(err && String(err.message).match(/(timed\sout|timedout)/)) {
|
235
|
251
|
this.dispatchEvent('timeout')
|
236
|
|
- if(this.ontimeout)
|
237
|
|
- this.ontimeout()
|
238
|
|
- }
|
239
|
|
- else if(this.onerror) {
|
240
|
|
- this.dispatchEvent('error')
|
241
|
|
- this.onerror({
|
242
|
|
- type : 'error',
|
243
|
|
- detail : err
|
244
|
|
- })
|
245
|
252
|
}
|
|
253
|
+ this.dispatchEvent('loadend')
|
|
254
|
+ this.dispatchEvent('error', {
|
|
255
|
+ type : 'error',
|
|
256
|
+ detail : err
|
|
257
|
+ })
|
|
258
|
+ this.clearEventListeners()
|
246
|
259
|
}
|
247
|
260
|
|
248
|
261
|
_onDone(resp) {
|
249
|
|
- log.verbose('XMLHttpRequest done', this._task.taskId, this)
|
250
|
|
- this.statusText = '200 OK'
|
251
|
|
- switch(resp.type) {
|
252
|
|
- case 'base64' :
|
253
|
|
- if(this.responseType === 'json') {
|
|
262
|
+ log.verbose('XMLHttpRequest done', this._url, resp)
|
|
263
|
+ this._statusText = this._status
|
|
264
|
+ if(resp) {
|
|
265
|
+ switch(resp.type) {
|
|
266
|
+ case 'base64' :
|
|
267
|
+ if(this._responseType === 'json') {
|
|
268
|
+ this._responseText = resp.text()
|
|
269
|
+ this._response = resp.json()
|
|
270
|
+ }
|
|
271
|
+ else {
|
254
|
272
|
this._responseText = resp.text()
|
255
|
|
- this._response = resp.json()
|
256
|
|
- }
|
257
|
|
- else {
|
|
273
|
+ this._response = this.responseText
|
|
274
|
+ }
|
|
275
|
+ break;
|
|
276
|
+ case 'path' :
|
|
277
|
+ this.response = resp.blob()
|
|
278
|
+ break;
|
|
279
|
+ default :
|
258
|
280
|
this._responseText = resp.text()
|
259
|
281
|
this._response = this.responseText
|
260
|
|
- }
|
261
|
|
- break;
|
262
|
|
- case 'path' :
|
263
|
|
- this.response = resp.blob()
|
264
|
|
- break;
|
|
282
|
+ break;
|
|
283
|
+ }
|
|
284
|
+ this.dispatchEvent('loadend')
|
|
285
|
+ this._dispatchReadStateChange(XMLHttpRequest.DONE)
|
265
|
286
|
}
|
266
|
|
- this.dispatchEvent('loadend')
|
267
|
|
- if(this.onloadend)
|
268
|
|
- this.onloadend()
|
269
|
|
- this.dispatchEvent('load')
|
270
|
|
- if(this._onload)
|
271
|
|
- this._onload()
|
272
|
|
- this.readyState = XMLHttpRequest.DONE
|
|
287
|
+ this.clearEventListeners()
|
|
288
|
+ }
|
|
289
|
+
|
|
290
|
+ _dispatchReadStateChange(state) {
|
|
291
|
+ this._readyState = state
|
|
292
|
+ if(typeof this._onreadystatechange === 'function')
|
|
293
|
+ this._onreadystatechange()
|
273
|
294
|
}
|
274
|
295
|
|
275
|
296
|
set onreadystatechange(fn:() => void) {
|
|
@@ -277,17 +298,8 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
277
|
298
|
this._onreadystatechange = fn
|
278
|
299
|
}
|
279
|
300
|
|
280
|
|
- set readyState(val:number) {
|
281
|
|
-
|
282
|
|
- log.verbose('XMLHttpRequest ready state changed to ', val)
|
283
|
|
- this._readyState = val
|
284
|
|
- if(this._onreadystatechange) {
|
285
|
|
- log.verbose('trigger onreadystatechange event', this._readyState)
|
286
|
|
- log.verbose(this._onreadystatechange)
|
287
|
|
- this.dispatchEvent('readystatechange', )
|
288
|
|
- if(this._onreadystatechange)
|
289
|
|
- this._onreadystatechange()
|
290
|
|
- }
|
|
301
|
+ get onreadystatechange(fn:() => void) {
|
|
302
|
+ return this._onreadystatechange
|
291
|
303
|
}
|
292
|
304
|
|
293
|
305
|
get readyState() {
|
|
@@ -300,20 +312,11 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
300
|
312
|
return this._status
|
301
|
313
|
}
|
302
|
314
|
|
303
|
|
- set statusText(val) {
|
304
|
|
- this._statusText = val
|
305
|
|
- }
|
306
|
|
-
|
307
|
315
|
get statusText() {
|
308
|
316
|
log.verbose('get statusText', this._statusText)
|
309
|
317
|
return this._statusText
|
310
|
318
|
}
|
311
|
319
|
|
312
|
|
- set response(val) {
|
313
|
|
- log.verbose('set response', val)
|
314
|
|
- this._response = val
|
315
|
|
- }
|
316
|
|
-
|
317
|
320
|
get response() {
|
318
|
321
|
log.verbose('get response', this._response)
|
319
|
322
|
return this._response
|
|
@@ -344,11 +347,6 @@ export default class XMLHttpRequest extends XMLHttpRequestEventTarget{
|
344
|
347
|
return this._timeout
|
345
|
348
|
}
|
346
|
349
|
|
347
|
|
- get upload() {
|
348
|
|
- log.verbose('get upload', this._upload)
|
349
|
|
- return this._upload
|
350
|
|
- }
|
351
|
|
-
|
352
|
350
|
get responseType() {
|
353
|
351
|
log.verbose('get response type', this._responseType)
|
354
|
352
|
return this._responseType
|