19
|
1 |
/* formdata-polyfill. MIT License. Jimmy Wärting <https://jimmy.warting.se/opensource> */ |
|
2 |
|
18
|
3 |
/* global FormData self Blob File */ |
|
4 |
/* eslint-disable no-inner-declarations */ |
|
5 |
|
|
6 |
if (typeof Blob !== 'undefined' && (typeof FormData === 'undefined' || !FormData.prototype.keys)) { |
|
7 |
const global = typeof globalThis === 'object' |
|
8 |
? globalThis |
|
9 |
: typeof window === 'object' |
|
10 |
? window |
|
11 |
: typeof self === 'object' ? self : this |
9
|
12 |
|
|
13 |
// keep a reference to native implementation |
|
14 |
const _FormData = global.FormData |
|
15 |
|
|
16 |
// To be monkey patched |
|
17 |
const _send = global.XMLHttpRequest && global.XMLHttpRequest.prototype.send |
|
18 |
const _fetch = global.Request && global.fetch |
18
|
19 |
const _sendBeacon = global.navigator && global.navigator.sendBeacon |
|
20 |
// Might be a worker thread... |
|
21 |
const _match = global.Element && global.Element.prototype |
9
|
22 |
|
18
|
23 |
// Unable to patch Request/Response constructor correctly #109 |
9
|
24 |
// only way is to use ES6 class extend |
|
25 |
// https://github.com/babel/babel/issues/1966 |
|
26 |
|
|
27 |
const stringTag = global.Symbol && Symbol.toStringTag |
|
28 |
|
|
29 |
// Add missing stringTags to blob and files |
|
30 |
if (stringTag) { |
|
31 |
if (!Blob.prototype[stringTag]) { |
|
32 |
Blob.prototype[stringTag] = 'Blob' |
|
33 |
} |
|
34 |
|
|
35 |
if ('File' in global && !File.prototype[stringTag]) { |
|
36 |
File.prototype[stringTag] = 'File' |
|
37 |
} |
|
38 |
} |
|
39 |
|
|
40 |
// Fix so you can construct your own File |
|
41 |
try { |
18
|
42 |
new File([], '') // eslint-disable-line |
9
|
43 |
} catch (a) { |
18
|
44 |
global.File = function File (b, d, c) { |
19
|
45 |
const blob = new Blob(b, c || {}) |
18
|
46 |
const t = c && void 0 !== c.lastModified ? new Date(c.lastModified) : new Date() |
9
|
47 |
|
|
48 |
Object.defineProperties(blob, { |
|
49 |
name: { |
|
50 |
value: d |
|
51 |
}, |
|
52 |
lastModified: { |
|
53 |
value: +t |
|
54 |
}, |
|
55 |
toString: { |
18
|
56 |
value () { |
9
|
57 |
return '[object File]' |
|
58 |
} |
|
59 |
} |
|
60 |
}) |
|
61 |
|
|
62 |
if (stringTag) { |
|
63 |
Object.defineProperty(blob, stringTag, { |
|
64 |
value: 'File' |
|
65 |
}) |
|
66 |
} |
|
67 |
|
|
68 |
return blob |
|
69 |
} |
|
70 |
} |
|
71 |
|
18
|
72 |
function ensureArgs (args, expected) { |
|
73 |
if (args.length < expected) { |
|
74 |
throw new TypeError(`${expected} argument required, but only ${args.length} present.`) |
|
75 |
} |
9
|
76 |
} |
|
77 |
|
19
|
78 |
/** |
|
79 |
* @param {string} name |
|
80 |
* @param {string | undefined} filename |
|
81 |
* @returns {[string, File|string]} |
|
82 |
*/ |
18
|
83 |
function normalizeArgs (name, value, filename) { |
19
|
84 |
if (value instanceof Blob) { |
|
85 |
filename = filename !== undefined |
|
86 |
? String(filename + '') |
|
87 |
: typeof value.name === 'string' |
|
88 |
? value.name |
|
89 |
: 'blob' |
9
|
90 |
|
19
|
91 |
if (value.name !== filename || Object.prototype.toString.call(value) === '[object Blob]') { |
|
92 |
value = new File([value], filename) |
|
93 |
} |
|
94 |
return [String(name), value] |
|
95 |
} |
|
96 |
return [String(name), String(value)] |
18
|
97 |
} |
|
98 |
|
19
|
99 |
// normalize line feeds for textarea |
18
|
100 |
// https://html.spec.whatwg.org/multipage/form-elements.html#textarea-line-break-normalisation-transformation |
|
101 |
function normalizeLinefeeds (value) { |
19
|
102 |
return value.replace(/\r?\n|\r/g, '\r\n') |
9
|
103 |
} |
|
104 |
|
19
|
105 |
/** |
|
106 |
* @template T |
|
107 |
* @param {ArrayLike<T>} arr |
|
108 |
* @param {{ (elm: T): void; }} cb |
|
109 |
*/ |
9
|
110 |
function each (arr, cb) { |
|
111 |
for (let i = 0; i < arr.length; i++) { |
|
112 |
cb(arr[i]) |
|
113 |
} |
|
114 |
} |
|
115 |
|
19
|
116 |
const escape = str => str.replace(/\n/g, '%0A').replace(/\r/g, '%0D').replace(/"/g, '%22') |
|
117 |
|
9
|
118 |
/** |
|
119 |
* @implements {Iterable} |
|
120 |
*/ |
|
121 |
class FormDataPolyfill { |
|
122 |
/** |
|
123 |
* FormData class |
|
124 |
* |
19
|
125 |
* @param {HTMLFormElement=} form |
9
|
126 |
*/ |
18
|
127 |
constructor (form) { |
19
|
128 |
/** @type {[string, string|File][]} */ |
18
|
129 |
this._data = [] |
9
|
130 |
|
|
131 |
const self = this |
19
|
132 |
form && each(form.elements, (/** @type {HTMLInputElement} */ elm) => { |
18
|
133 |
if ( |
|
134 |
!elm.name || |
|
135 |
elm.disabled || |
|
136 |
elm.type === 'submit' || |
|
137 |
elm.type === 'button' || |
|
138 |
elm.matches('form fieldset[disabled] *') |
|
139 |
) return |
9
|
140 |
|
|
141 |
if (elm.type === 'file') { |
18
|
142 |
const files = elm.files && elm.files.length |
|
143 |
? elm.files |
|
144 |
: [new File([], '', { type: 'application/octet-stream' })] // #78 |
|
145 |
|
|
146 |
each(files, file => { |
9
|
147 |
self.append(elm.name, file) |
|
148 |
}) |
|
149 |
} else if (elm.type === 'select-multiple' || elm.type === 'select-one') { |
|
150 |
each(elm.options, opt => { |
|
151 |
!opt.disabled && opt.selected && self.append(elm.name, opt.value) |
|
152 |
}) |
|
153 |
} else if (elm.type === 'checkbox' || elm.type === 'radio') { |
|
154 |
if (elm.checked) self.append(elm.name, elm.value) |
|
155 |
} else { |
18
|
156 |
const value = elm.type === 'textarea' ? normalizeLinefeeds(elm.value) : elm.value |
|
157 |
self.append(elm.name, value) |
9
|
158 |
} |
|
159 |
}) |
|
160 |
} |
|
161 |
|
|
162 |
/** |
|
163 |
* Append a field |
|
164 |
* |
18
|
165 |
* @param {string} name field name |
|
166 |
* @param {string|Blob|File} value string / blob / file |
|
167 |
* @param {string=} filename filename to use with blob |
|
168 |
* @return {undefined} |
9
|
169 |
*/ |
18
|
170 |
append (name, value, filename) { |
|
171 |
ensureArgs(arguments, 2) |
|
172 |
this._data.push(normalizeArgs(name, value, filename)) |
9
|
173 |
} |
|
174 |
|
|
175 |
/** |
|
176 |
* Delete all fields values given name |
|
177 |
* |
18
|
178 |
* @param {string} name Field name |
|
179 |
* @return {undefined} |
9
|
180 |
*/ |
18
|
181 |
delete (name) { |
|
182 |
ensureArgs(arguments, 1) |
|
183 |
const result = [] |
|
184 |
name = String(name) |
|
185 |
|
|
186 |
each(this._data, entry => { |
|
187 |
entry[0] !== name && result.push(entry) |
|
188 |
}) |
|
189 |
|
|
190 |
this._data = result |
9
|
191 |
} |
|
192 |
|
|
193 |
/** |
|
194 |
* Iterate over all fields as [name, value] |
|
195 |
* |
|
196 |
* @return {Iterator} |
|
197 |
*/ |
18
|
198 |
* entries () { |
|
199 |
for (var i = 0; i < this._data.length; i++) { |
19
|
200 |
yield this._data[i] |
18
|
201 |
} |
9
|
202 |
} |
|
203 |
|
|
204 |
/** |
|
205 |
* Iterate over all fields |
|
206 |
* |
|
207 |
* @param {Function} callback Executed for each item with parameters (value, name, thisArg) |
|
208 |
* @param {Object=} thisArg `this` context for callback function |
|
209 |
*/ |
18
|
210 |
forEach (callback, thisArg) { |
|
211 |
ensureArgs(arguments, 1) |
|
212 |
for (const [name, value] of this) { |
9
|
213 |
callback.call(thisArg, value, name, this) |
18
|
214 |
} |
9
|
215 |
} |
|
216 |
|
|
217 |
/** |
|
218 |
* Return first field value given name |
19
|
219 |
* or null if non existent |
9
|
220 |
* |
18
|
221 |
* @param {string} name Field name |
|
222 |
* @return {string|File|null} value Fields value |
9
|
223 |
*/ |
18
|
224 |
get (name) { |
|
225 |
ensureArgs(arguments, 1) |
|
226 |
const entries = this._data |
|
227 |
name = String(name) |
|
228 |
for (let i = 0; i < entries.length; i++) { |
|
229 |
if (entries[i][0] === name) { |
19
|
230 |
return entries[i][1] |
18
|
231 |
} |
|
232 |
} |
|
233 |
return null |
9
|
234 |
} |
|
235 |
|
|
236 |
/** |
|
237 |
* Return all fields values given name |
|
238 |
* |
18
|
239 |
* @param {string} name Fields name |
9
|
240 |
* @return {Array} [{String|File}] |
|
241 |
*/ |
18
|
242 |
getAll (name) { |
|
243 |
ensureArgs(arguments, 1) |
|
244 |
const result = [] |
|
245 |
name = String(name) |
|
246 |
each(this._data, data => { |
19
|
247 |
data[0] === name && result.push(data[1]) |
18
|
248 |
}) |
|
249 |
|
|
250 |
return result |
9
|
251 |
} |
|
252 |
|
|
253 |
/** |
|
254 |
* Check for field name existence |
|
255 |
* |
18
|
256 |
* @param {string} name Field name |
9
|
257 |
* @return {boolean} |
|
258 |
*/ |
18
|
259 |
has (name) { |
|
260 |
ensureArgs(arguments, 1) |
|
261 |
name = String(name) |
|
262 |
for (let i = 0; i < this._data.length; i++) { |
|
263 |
if (this._data[i][0] === name) { |
|
264 |
return true |
|
265 |
} |
|
266 |
} |
|
267 |
return false |
9
|
268 |
} |
|
269 |
|
|
270 |
/** |
|
271 |
* Iterate over all fields name |
|
272 |
* |
|
273 |
* @return {Iterator} |
|
274 |
*/ |
18
|
275 |
* keys () { |
|
276 |
for (const [name] of this) { |
9
|
277 |
yield name |
18
|
278 |
} |
9
|
279 |
} |
|
280 |
|
|
281 |
/** |
|
282 |
* Overwrite all values given name |
|
283 |
* |
18
|
284 |
* @param {string} name Filed name |
|
285 |
* @param {string} value Field value |
|
286 |
* @param {string=} filename Filename (optional) |
9
|
287 |
*/ |
18
|
288 |
set (name, value, filename) { |
|
289 |
ensureArgs(arguments, 2) |
|
290 |
name = String(name) |
19
|
291 |
/** @type {[string, string|File][]} */ |
18
|
292 |
const result = [] |
|
293 |
const args = normalizeArgs(name, value, filename) |
|
294 |
let replace = true |
|
295 |
|
|
296 |
// - replace the first occurrence with same name |
19
|
297 |
// - discards the remaining with same name |
18
|
298 |
// - while keeping the same order items where added |
|
299 |
each(this._data, data => { |
|
300 |
data[0] === name |
|
301 |
? replace && (replace = !result.push(args)) |
|
302 |
: result.push(data) |
|
303 |
}) |
|
304 |
|
|
305 |
replace && result.push(args) |
|
306 |
|
|
307 |
this._data = result |
9
|
308 |
} |
|
309 |
|
|
310 |
/** |
|
311 |
* Iterate over all fields |
|
312 |
* |
|
313 |
* @return {Iterator} |
|
314 |
*/ |
18
|
315 |
* values () { |
|
316 |
for (const [, value] of this) { |
9
|
317 |
yield value |
18
|
318 |
} |
9
|
319 |
} |
|
320 |
|
|
321 |
/** |
|
322 |
* Return a native (perhaps degraded) FormData with only a `append` method |
|
323 |
* Can throw if it's not supported |
|
324 |
* |
|
325 |
* @return {FormData} |
|
326 |
*/ |
18
|
327 |
['_asNative'] () { |
|
328 |
const fd = new _FormData() |
9
|
329 |
|
18
|
330 |
for (const [name, value] of this) { |
9
|
331 |
fd.append(name, value) |
18
|
332 |
} |
9
|
333 |
|
|
334 |
return fd |
|
335 |
} |
|
336 |
|
|
337 |
/** |
|
338 |
* [_blob description] |
|
339 |
* |
|
340 |
* @return {Blob} [description] |
|
341 |
*/ |
18
|
342 |
['_blob'] () { |
19
|
343 |
const boundary = '----formdata-polyfill-' + Math.random(), |
|
344 |
chunks = [], |
|
345 |
p = `--${boundary}\r\nContent-Disposition: form-data; name="` |
|
346 |
this.forEach((value, name) => typeof value == 'string' |
|
347 |
? chunks.push(p + escape(normalizeLinefeeds(name)) + `"\r\n\r\n${normalizeLinefeeds(value)}\r\n`) |
|
348 |
: chunks.push(p + escape(normalizeLinefeeds(name)) + `"; filename="${escape(value.name)}"\r\nContent-Type: ${value.type||"application/octet-stream"}\r\n\r\n`, value, `\r\n`)) |
|
349 |
chunks.push(`--${boundary}--`) |
|
350 |
return new Blob(chunks, { |
|
351 |
type: "multipart/form-data; boundary=" + boundary |
|
352 |
}) |
9
|
353 |
} |
|
354 |
|
|
355 |
/** |
|
356 |
* The class itself is iterable |
|
357 |
* alias for formdata.entries() |
|
358 |
* |
19
|
359 |
* @return {Iterator} |
9
|
360 |
*/ |
18
|
361 |
[Symbol.iterator] () { |
9
|
362 |
return this.entries() |
|
363 |
} |
|
364 |
|
|
365 |
/** |
|
366 |
* Create the default string description. |
|
367 |
* |
18
|
368 |
* @return {string} [object FormData] |
9
|
369 |
*/ |
18
|
370 |
toString () { |
9
|
371 |
return '[object FormData]' |
|
372 |
} |
|
373 |
} |
|
374 |
|
18
|
375 |
if (_match && !_match.matches) { |
|
376 |
_match.matches = |
|
377 |
_match.matchesSelector || |
|
378 |
_match.mozMatchesSelector || |
|
379 |
_match.msMatchesSelector || |
|
380 |
_match.oMatchesSelector || |
|
381 |
_match.webkitMatchesSelector || |
|
382 |
function (s) { |
|
383 |
var matches = (this.document || this.ownerDocument).querySelectorAll(s) |
|
384 |
var i = matches.length |
|
385 |
while (--i >= 0 && matches.item(i) !== this) {} |
|
386 |
return i > -1 |
|
387 |
} |
|
388 |
} |
9
|
389 |
|
|
390 |
if (stringTag) { |
|
391 |
/** |
|
392 |
* Create the default string description. |
|
393 |
* It is accessed internally by the Object.prototype.toString(). |
|
394 |
*/ |
|
395 |
FormDataPolyfill.prototype[stringTag] = 'FormData' |
|
396 |
} |
|
397 |
|
|
398 |
// Patch xhr's send method to call _blob transparently |
|
399 |
if (_send) { |
18
|
400 |
const setRequestHeader = global.XMLHttpRequest.prototype.setRequestHeader |
|
401 |
|
|
402 |
global.XMLHttpRequest.prototype.setRequestHeader = function (name, value) { |
|
403 |
setRequestHeader.call(this, name, value) |
|
404 |
if (name.toLowerCase() === 'content-type') this._hasContentType = true |
|
405 |
} |
|
406 |
|
|
407 |
global.XMLHttpRequest.prototype.send = function (data) { |
|
408 |
// need to patch send b/c old IE don't send blob's type (#44) |
9
|
409 |
if (data instanceof FormDataPolyfill) { |
|
410 |
const blob = data['_blob']() |
18
|
411 |
if (!this._hasContentType) this.setRequestHeader('Content-Type', blob.type) |
9
|
412 |
_send.call(this, blob) |
|
413 |
} else { |
|
414 |
_send.call(this, data) |
|
415 |
} |
|
416 |
} |
|
417 |
} |
|
418 |
|
|
419 |
// Patch fetch's function to call _blob transparently |
|
420 |
if (_fetch) { |
18
|
421 |
global.fetch = function (input, init) { |
9
|
422 |
if (init && init.body && init.body instanceof FormDataPolyfill) { |
|
423 |
init.body = init.body['_blob']() |
|
424 |
} |
|
425 |
|
18
|
426 |
return _fetch.call(this, input, init) |
|
427 |
} |
|
428 |
} |
|
429 |
|
|
430 |
// Patch navigator.sendBeacon to use native FormData |
|
431 |
if (_sendBeacon) { |
|
432 |
global.navigator.sendBeacon = function (url, data) { |
|
433 |
if (data instanceof FormDataPolyfill) { |
|
434 |
data = data['_asNative']() |
|
435 |
} |
|
436 |
return _sendBeacon.call(this, url, data) |
9
|
437 |
} |
|
438 |
} |
|
439 |
|
|
440 |
global['FormData'] = FormDataPolyfill |
|
441 |
} |