| 1 |
/* |
| 2 |
* jQuery Iframe Transport Plugin |
| 3 |
* https://github.com/blueimp/jQuery-File-Upload |
| 4 |
* |
| 5 |
* Copyright 2011, Sebastian Tschan |
| 6 |
* https://blueimp.net |
| 7 |
* |
| 8 |
* Licensed under the MIT license: |
| 9 |
* http://www.opensource.org/licenses/MIT |
| 10 |
*/ |
| 11 |
|
| 12 |
/* global define, require, window, document */ |
| 13 |
|
| 14 |
(function (factory) { |
| 15 |
'use strict'; |
| 16 |
if (typeof define === 'function' && define.amd) { |
| 17 |
// Register as an anonymous AMD module: |
| 18 |
define(['jquery'], factory); |
| 19 |
} else if (typeof exports === 'object') { |
| 20 |
// Node/CommonJS: |
| 21 |
factory(require('jquery')); |
| 22 |
} else { |
| 23 |
// Browser globals: |
| 24 |
factory(window.jQuery); |
| 25 |
} |
| 26 |
}(function ($) { |
| 27 |
'use strict'; |
| 28 |
|
| 29 |
// Helper variable to create unique names for the transport iframes: |
| 30 |
var counter = 0; |
| 31 |
|
| 32 |
// The iframe transport accepts four additional options: |
| 33 |
// options.fileInput: a jQuery collection of file input fields |
| 34 |
// options.paramName: the parameter name for the file form data, |
| 35 |
// overrides the name property of the file input field(s), |
| 36 |
// can be a string or an array of strings. |
| 37 |
// options.formData: an array of objects with name and value properties, |
| 38 |
// equivalent to the return data of .serializeArray(), e.g.: |
| 39 |
// [{name: 'a', value: 1}, {name: 'b', value: 2}] |
| 40 |
// options.initialIframeSrc: the URL of the initial iframe src, |
| 41 |
// by default set to "javascript:false;" |
| 42 |
$.ajaxTransport('iframe', function (options) { |
| 43 |
if (options.async) { |
| 44 |
// javascript:false as initial iframe src |
| 45 |
// prevents warning popups on HTTPS in IE6: |
| 46 |
/*jshint scripturl: true */ |
| 47 |
var initialIframeSrc = options.initialIframeSrc || 'javascript:false;', |
| 48 |
/*jshint scripturl: false */ |
| 49 |
form, |
| 50 |
iframe, |
| 51 |
addParamChar; |
| 52 |
return { |
| 53 |
send: function (_, completeCallback) { |
| 54 |
form = $('<form style="display:none;"></form>'); |
| 55 |
form.attr('accept-charset', options.formAcceptCharset); |
| 56 |
addParamChar = /\?/.test(options.url) ? '&' : '?'; |
| 57 |
// XDomainRequest only supports GET and POST: |
| 58 |
if (options.type === 'DELETE') { |
| 59 |
options.url = options.url + addParamChar + '_method=DELETE'; |
| 60 |
options.type = 'POST'; |
| 61 |
} else if (options.type === 'PUT') { |
| 62 |
options.url = options.url + addParamChar + '_method=PUT'; |
| 63 |
options.type = 'POST'; |
| 64 |
} else if (options.type === 'PATCH') { |
| 65 |
options.url = options.url + addParamChar + '_method=PATCH'; |
| 66 |
options.type = 'POST'; |
| 67 |
} |
| 68 |
// IE versions below IE8 cannot set the name property of |
| 69 |
// elements that have already been added to the DOM, |
| 70 |
// so we set the name along with the iframe HTML markup: |
| 71 |
counter += 1; |
| 72 |
iframe = $( |
| 73 |
'<iframe src="' + initialIframeSrc + |
| 74 |
'" name="iframe-transport-' + counter + '"></iframe>' |
| 75 |
).bind('load', function () { |
| 76 |
var fileInputClones, |
| 77 |
paramNames = $.isArray(options.paramName) ? |
| 78 |
options.paramName : [options.paramName]; |
| 79 |
iframe |
| 80 |
.unbind('load') |
| 81 |
.bind('load', function () { |
| 82 |
var response; |
| 83 |
// Wrap in a try/catch block to catch exceptions thrown |
| 84 |
// when trying to access cross-domain iframe contents: |
| 85 |
try { |
| 86 |
response = iframe.contents(); |
| 87 |
// Google Chrome and Firefox do not throw an |
| 88 |
// exception when calling iframe.contents() on |
| 89 |
// cross-domain requests, so we unify the response: |
| 90 |
if (!response.length || !response[0].firstChild) { |
| 91 |
throw new Error(); |
| 92 |
} |
| 93 |
} catch (e) { |
| 94 |
response = undefined; |
| 95 |
} |
| 96 |
// The complete callback returns the |
| 97 |
// iframe content document as response object: |
| 98 |
completeCallback( |
| 99 |
200, |
| 100 |
'success', |
| 101 |
{'iframe': response} |
| 102 |
); |
| 103 |
// Fix for IE endless progress bar activity bug |
| 104 |
// (happens on form submits to iframe targets): |
| 105 |
$('<iframe src="' + initialIframeSrc + '"></iframe>') |
| 106 |
.appendTo(form); |
| 107 |
window.setTimeout(function () { |
| 108 |
// Removing the form in a setTimeout call |
| 109 |
// allows Chrome's developer tools to display |
| 110 |
// the response result |
| 111 |
form.remove(); |
| 112 |
}, 0); |
| 113 |
}); |
| 114 |
form |
| 115 |
.prop('target', iframe.prop('name')) |
| 116 |
.prop('action', options.url) |
| 117 |
.prop('method', options.type); |
| 118 |
if (options.formData) { |
| 119 |
$.each(options.formData, function (index, field) { |
| 120 |
$('<input type="hidden"/>') |
| 121 |
.prop('name', field.name) |
| 122 |
.val(field.value) |
| 123 |
.appendTo(form); |
| 124 |
}); |
| 125 |
} |
| 126 |
if (options.fileInput && options.fileInput.length && |
| 127 |
options.type === 'POST') { |
| 128 |
fileInputClones = options.fileInput.clone(); |
| 129 |
// Insert a clone for each file input field: |
| 130 |
options.fileInput.after(function (index) { |
| 131 |
return fileInputClones[index]; |
| 132 |
}); |
| 133 |
if (options.paramName) { |
| 134 |
options.fileInput.each(function (index) { |
| 135 |
$(this).prop( |
| 136 |
'name', |
| 137 |
paramNames[index] || options.paramName |
| 138 |
); |
| 139 |
}); |
| 140 |
} |
| 141 |
// Appending the file input fields to the hidden form |
| 142 |
// removes them from their original location: |
| 143 |
form |
| 144 |
.append(options.fileInput) |
| 145 |
.prop('enctype', 'multipart/form-data') |
| 146 |
// enctype must be set as encoding for IE: |
| 147 |
.prop('encoding', 'multipart/form-data'); |
| 148 |
// Remove the HTML5 form attribute from the input(s): |
| 149 |
options.fileInput.removeAttr('form'); |
| 150 |
} |
| 151 |
form.submit(); |
| 152 |
// Insert the file input fields at their original location |
| 153 |
// by replacing the clones with the originals: |
| 154 |
if (fileInputClones && fileInputClones.length) { |
| 155 |
options.fileInput.each(function (index, input) { |
| 156 |
var clone = $(fileInputClones[index]); |
| 157 |
// Restore the original name and form properties: |
| 158 |
$(input) |
| 159 |
.prop('name', clone.prop('name')) |
| 160 |
.attr('form', clone.attr('form')); |
| 161 |
clone.replaceWith(input); |
| 162 |
}); |
| 163 |
} |
| 164 |
}); |
| 165 |
form.append(iframe).appendTo(document.body); |
| 166 |
}, |
| 167 |
abort: function () { |
| 168 |
if (iframe) { |
| 169 |
// javascript:false as iframe src aborts the request |
| 170 |
// and prevents warning popups on HTTPS in IE6. |
| 171 |
// concat is used to avoid the "Script URL" JSLint error: |
| 172 |
iframe |
| 173 |
.unbind('load') |
| 174 |
.prop('src', initialIframeSrc); |
| 175 |
} |
| 176 |
if (form) { |
| 177 |
form.remove(); |
| 178 |
} |
| 179 |
} |
| 180 |
}; |
| 181 |
} |
| 182 |
}); |
| 183 |
|
| 184 |
// The iframe transport returns the iframe content document as response. |
| 185 |
// The following adds converters from iframe to text, json, html, xml |
| 186 |
// and script. |
| 187 |
// Please note that the Content-Type for JSON responses has to be text/plain |
| 188 |
// or text/html, if the browser doesn't include application/json in the |
| 189 |
// Accept header, else IE will show a download dialog. |
| 190 |
// The Content-Type for XML responses on the other hand has to be always |
| 191 |
// application/xml or text/xml, so IE properly parses the XML response. |
| 192 |
// See also |
| 193 |
// https://github.com/blueimp/jQuery-File-Upload/wiki/Setup#content-type-negotiation |
| 194 |
$.ajaxSetup({ |
| 195 |
converters: { |
| 196 |
'iframe text': function (iframe) { |
| 197 |
return iframe && $(iframe[0].body).text(); |
| 198 |
}, |
| 199 |
'iframe json': function (iframe) { |
| 200 |
return iframe && $.parseJSON($(iframe[0].body).text()); |
| 201 |
}, |
| 202 |
'iframe html': function (iframe) { |
| 203 |
return iframe && $(iframe[0].body).html(); |
| 204 |
}, |
| 205 |
'iframe xml': function (iframe) { |
| 206 |
var xmlDoc = iframe && iframe[0]; |
| 207 |
return xmlDoc && $.isXMLDoc(xmlDoc) ? xmlDoc : |
| 208 |
$.parseXML((xmlDoc.XMLDocument && xmlDoc.XMLDocument.xml) || |
| 209 |
$(xmlDoc.body).html()); |
| 210 |
}, |
| 211 |
'iframe script': function (iframe) { |
| 212 |
return iframe && $.globalEval($(iframe[0].body).text()); |
| 213 |
} |
| 214 |
} |
| 215 |
}); |
| 216 |
|
| 217 |
})); |
| 218 |
|
