Skip to content

Instantly share code, notes, and snippets.

@dsdstudio
Last active December 14, 2015 17:29
Show Gist options
  • Save dsdstudio/5122617 to your computer and use it in GitHub Desktop.
Save dsdstudio/5122617 to your computer and use it in GitHub Desktop.
TinyAjaxUpload.js :)
/**
* FileUploadLibrary
* @since 2014.07.24
* by Bohyung kim a.k.a dsdstudio ( dsdgun@gmail.com, http://blog.dsdstudio.net )
* {
* el:'#element', // ElementSelector
* responseConverter:function(data) // default -> json converter
* actionUrl:'upload', // Action URL, default value => form.action
* success: function(data){}, // success callback
* error: function(err) {}, // error callback
* progress:function() {} // progress callback. update your progress ui
* }
*/
function ajaxUpload(option) {
if ( !Date.now ) Date.now = +new Date;
var $form, xhr2supported;
xhr2supported = !!( window.FormData && ("upload" in ($.ajaxSettings.xhr())) );
// override settings && $form -> jqueryobj
$form = $((option = $.extend({
el: 'form',
actionUrl: '',
success: function (data) { alert(data); },
responseConverter: function (data) {
try {
return $.parseJSON(data);
} catch (e) {
option.error(e);
}
},
error: function (err) { },
progress: function (e) { },
beforeSend: function() {}
}, option || {})).el);
function upload($form) {
var formdata = new FormData($form[0]);
$.ajax({
url: option.actionUrl,
type: "POST", data: formdata, dataType: option.dataType,
processData: false, contentType: false, cache: false,
success: function(data) { option.success(option.responseConverter(data)); } , error: option.error, progress: option.progress,
xhr: function () {
var req = $.ajaxSettings.xhr(), self = this;
if (req.upload) {
req.upload.addEventListener("progress", function (e) {
self.progress(e);
}, false);
}
return req;
}
});
}
function uploadIE($form){
var id = 'borongUpload_' + Date.now();
// bind form target to dummyiframeid
$form.attr({
'target': id,
'action': option.actionUrl,
'method': 'post',
'enctype': 'multipart/form-data'
});
// create Dummy iFrame
var iframesrc, $iframe;
iframesrc = /^https/i.test(window.location.href || '') ? 'javascript'.concat(':false') : 'about:blank';
($iframe = $('<iframe />')
.attr({"src":iframesrc, "id":id, "name":id, "width":0, "height":0,"style":"width: 0; height: 0; border: none;"})
.appendTo('body'))
.bind('load', function () {
var doc = $iframe[0].contentDocument || $iframe[0].contentWindow.document, data = doc.body;
// fire success callback
option.success.call(this, option.responseConverter($(data).text()));
// loadevent unbind
$iframe.unbind('load');
// dummy iframe remove
setTimeout(function () { $iframe.remove(); }, 250);
});
$form.submit();
}
// fire beforesend callback
option.beforeSend();
if (xhr2supported) upload($form);
else uploadIE($form);
}
@dsdstudio
Copy link
Author

IE계열에서 몇가지 사소한 버그 수정

@dsdstudio
Copy link
Author

iFrame 쪽 중복코드 정리

@dsdstudio
Copy link
Author

코드 리팩토링

@dsdstudio
Copy link
Author

IE가 아닌브라우저에서 success 쪽 responseConverter를 통하지않은 날 데이터가 넘어오는 문제 수정

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment