TinyAjaxUpload.js :)

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);
}

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

iFrame 쪽 중복코드 정리

코드 리팩토링

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