由于文档属性中没有headers字段， 所以我们需要对源代码进行改造。
首先在变量p中加入headers字段，表示接受此扩展参数。
其次在讲headers字段传入XMLHttpRequest请求中。
完整代码如下：
(function (d) {
var r = {
init: function (n) {
return this.each(function () {
var s = d(this);
s.data("uploadifive", {
inputs: {},
inputCount: 0,
fileID: 0,
queue: {
count: 0,
selected: 0,
replaced: 0,
errors: 0,
queued: 0,
cancelled: 0,
},
uploads: {
current: 0,
attempts: 0,
successful: 0,
errors: 0,
count: 0,
},
});
var f = s.data("uploadifive");
var p = (f.settings = d.extend(
{
auto: true,
headers: {
},
buttonClass: false,
buttonText: "Select Files",
checkScript: false,
dnd: true,
dropTarget: false,
fileObjName: "Filedata",
fileSizeLimit: 0,
fileType: false,
formData: {},
height: 30,
itemTemplate: false,
method: "post",
multi: true,
overrideEvents: [],
queueID: false,
queueSizeLimit: 0,
removeCompleted: false,
simUploadLimit: 0,
truncateLength: 0,
uploadLimit: 0,
uploadScript: "uploadifive.php",
width: 100,
},
n
));
if (isNaN(p.fileSizeLimit)) {
var e = parseInt(p.fileSizeLimit) * 1.024;
if (p.fileSizeLimit.indexOf("KB") > -1) {
p.fileSizeLimit = e * 1e3;
} else if (p.fileSizeLimit.indexOf("MB") > -1) {
p.fileSizeLimit = e * 1e6;
} else if (p.fileSizeLimit.indexOf("GB") > -1) {
p.fileSizeLimit = e * 1e9;
}
} else {
p.fileSizeLimit = p.fileSizeLimit * 1024;
}
f.inputTemplate = d('<input class="file" type="file">').css({
"font-size": p.height + "px",
opacity: 0,
position: "absolute",
top: "-3px",
"z-index": 999,
});
f.createInput = function () {
var e = f.inputTemplate.clone();
var t = (e.name = "input" + f.inputCount++);
if (p.multi) {
e.attr("multiple", true);
}
if (p.fileType) {
e.attr("accept", p.fileType);
}
e.bind("change", function () {
f.queue.selected = 0;
f.queue.replaced = 0;
f.queue.errors = 0;
f.queue.queued = 0;
var e = this.files.length;
f.queue.selected = e;
if (
f.queue.count + e > p.queueSizeLimit &&
p.queueSizeLimit !== 0
) {
if (d.inArray("onError", p.overrideEvents) < 0) {
alert(
"上传列表中最多只能存放 (" + p.queueSizeLimit + ")个文件"
);
}
if (typeof p.onError === "function") {
p.onError.call(s, "QUEUE_LIMIT_EXCEEDED");
}
} else {
for (var i = 0; i < e; i++) {
file = this.files[i];
f.addQueueItem(file);
}
f.inputs[t] = this;
f.createInput();
}
if (p.auto) {
r.upload.call(s);
}
if (typeof p.onSelect === "function") {
p.onSelect.call(s, f.queue);
}
});
if (f.currentInput) {
f.currentInput.hide();
}
f.button.append(e);
f.currentInput = e;
};
f.destroyInput = function (e) {
d(f.inputs[e]).remove();
delete f.inputs[e];
f.inputCount--;
};
f.drop = function (e) {
f.queue.selected = 0;
f.queue.replaced = 0;
f.queue.errors = 0;
f.queue.queued = 0;
var i = e.dataTransfer;
var t = (i.name = "input" + f.inputCount++);
var n = i.files.length;
f.queue.selected = n;
if (f.queue.count + n > p.queueSizeLimit && p.queueSizeLimit !== 0) {
if (d.inArray("onError", p.overrideEvents) < 0) {
alert(
"The maximum number of queue items has been reached (" +
p.queueSizeLimit +
"). Please select fewer files."
);
}
if (typeof p.onError === "function") {
p.onError.call(s, "QUEUE_LIMIT_EXCEEDED");
}
} else {
for (var o = 0; o < n; o++) {
file = i.files[o];
f.addQueueItem(file);
}
f.inputs[t] = i;
}
if (p.auto) {
r.upload.call(s);
}
if (typeof p.onDrop === "function") {
p.onDrop.call(s, i.files, i.files.length);
}
e.preventDefault();
e.stopPropagation();
};
f.fileExistsInQueue = function (e) {
for (var i in f.inputs) {
input = f.inputs[i];
limit = input.files.length;
for (var t = 0; t < limit; t++) {
existingFile = input.files[t];
if (existingFile.name == e.name && !existingFile.complete) {
return true;
}
}
}
return false;
};
f.removeExistingFile = function (e) {
for (var i in f.inputs) {
input = f.inputs[i];
limit = input.files.length;
for (var t = 0; t < limit; t++) {
existingFile = input.files[t];
if (existingFile.name == e.name && !existingFile.complete) {
f.queue.replaced++;
r.cancel.call(s, existingFile, true);
}
}
}
};
if (p.itemTemplate == false) {
f.queueItem = d(
'<div id="${fileID}" class="uploadifive-queue-item"> <div class="uploadifive-queue-item-baseimg"/> <span class="fileName">${fileName}</span> <div class="uploadifive-queue-item-control"> <a href="javascript:$(\'#${instanceID}\').uploadifive(\'cancel\', \'${fileID}\')" class="uploadifive-queue-item-control-base uploadifive-queue-item-control-cancel">取消</a> </div> <div class="uploadifive-queue-item-extend"> <div class="uploadifive-progress"> \t\t\t\t\t\t <div class="uploadifive-progress-bar">\x3c!--Progress Bar--\x3e</div> \t\t\t\t\t </div> <span class="data"></span> </div> \t\t\t\t</div>'
);
} else {
f.queueItem = d(p.itemTemplate);
}
f.addQueueItem = function (e) {
if (d.inArray("onAddQueueItem", p.overrideEvents) < 0) {
f.removeExistingFile(e);
e.queueItem = f.queueItem.clone();
e.queueItem.attr("id", p.id + "-file-" + f.fileID++);
e.queueItem.find(".close").bind("click", function () {
r.cancel.call(s, e);
return false;
});
var i = e.name;
if (i.length > p.truncateLength && p.truncateLength != 0) {
i = i.substring(0, p.truncateLength) + "...";
}
e.queueItem.find(".filename").html(i);
var t = Math.round(e.size / 1024);
var n = "KB";
if (t > 1e3) {
t = Math.round(t / 1e3);
n = "MB";
}
var o = t.toString().split(".");
t = o[0];
if (o.length > 1) {
t += "." + o[1].substr(0, 2);
}
t += n;
e.queueItem.find(".filesize").html(" (" + t + ")");
e.queueItem.data("file", e);
f.queueEl.append(e.queueItem);
}
if (typeof p.onAddQueueItem === "function") {
p.onAddQueueItem.call(s, e);
}
if (e.size > p.fileSizeLimit && p.fileSizeLimit != 0) {
f.error("FILE_SIZE_LIMIT_EXCEEDED", e);
} else {
f.queue.queued++;
f.queue.count++;
}
};
f.removeQueueItem = function (e, i, t) {
if (!t) t = 0;
var n = i ? 0 : 500;
if (e.queueItem) {
if (e.queueItem.find(".fileinfo").html() != " - 上传成功") {
e.queueItem.find(".fileinfo").html(" - 已取消");
}
e.queueItem.find(".progress-bar").width(0);
e.queueItem.delay(t).fadeOut(n, function () {
d(this).remove();
});
delete e.queueItem;
f.queue.count--;
}
};
f.filesToUpload = function () {
var e = 0;
for (var i in f.inputs) {
input = f.inputs[i];
limit = input.files.length;
for (var t = 0; t < limit; t++) {
file = input.files[t];
if (!file.skip && !file.complete) {
e++;
}
}
}
return e;
};
f.checkExists = function (i) {
if (d.inArray("onCheck", p.overrideEvents) < 0) {
d.ajaxSetup({ async: false });
var e = d.extend(p.formData, { filename: i.name });
d.post(p.checkScript, e, function (e) {
i.exists = parseInt(e);
});
if (i.exists) {
if (
!confirm(
"A file named " +
i.name +
" already exists in the upload folder.\nWould you like to replace it?"
)
) {
r.cancel.call(s, i);
return true;
}
}
}
if (typeof p.onCheck === "function") {
p.onCheck.call(s, i, i.exists);
}
return false;
};
f.uploadFile = function (a, l) {
if (!a.skip && !a.complete && !a.uploading) {
a.uploading = true;
f.uploads.current++;
f.uploads.attempted++;
xhr = a.xhr = new XMLHttpRequest();
if (
typeof FormData === "function" ||
typeof FormData === "object"
) {
var e = new FormData();
e.append(p.fileObjName, a);
for (i in p.formData) {
e.append(i, p.formData[i]);
}
xhr.open(p.method, p.uploadScript, true);
if (p.headers) {
let headersValues = null;
headersValues = Object.keys(p.headers);
headersValues.forEach((key) => {
xhr.setRequestHeader(key, p.headers[key]);
});
}
xhr.upload.addEventListener(
"progress",
function (e) {
if (e.lengthComputable) {
f.progress(e, a);
}
},
false
);
xhr.addEventListener("load", function (e) {
if (this.readyState == 4) {
a.uploading = false;
if (this.status == 200) {
if (a.xhr.responseText !== "Invalid file type.") {
f.uploadComplete(e, a, l);
} else {
f.error(a.xhr.responseText, a, l);
}
} else if (this.status == 404) {
f.error("404_FILE_NOT_FOUND", a, l);
} else if (this.status == 403) {
f.error("403_FORBIDDEN", a, l);
} else {
f.error("Unknown Error", a, l);
}
}
});
xhr.send(e);
} else {
var t = new FileReader();
t.onload = function (e) {
var i = "-------------------------" + new Date().getTime(),
t = "--",
n = "\r\n",
o = "";
o += t + i + n;
o +=
'Content-Disposition: form-data; name="' +
p.fileObjName +
'"';
if (a.name) {
o += '; filename="' + a.name + '"';
}
o += n;
o += "Content-Type: application/octet-stream" + n + n;
o += e.target.result + n;
for (key in p.formData) {
o += t + i + n;
o +=
'Content-Disposition: form-data; name="' +
key +
'"' +
n +
n;
o += p.formData[key] + n;
}
o += t + i + t + n;
xhr.upload.addEventListener(
"progress",
function (e) {
f.progress(e, a);
},
false
);
xhr.addEventListener(
"load",
function (e) {
a.uploading = false;
var i = this.status;
if (i == 404) {
f.error("404_FILE_NOT_FOUND", a, l);
} else {
if (a.xhr.responseText != "Invalid file type.") {
f.uploadComplete(e, a, l);
} else {
f.error(a.xhr.responseText, a, l);
}
}
},
false
);
var r = p.uploadScript;
if (p.method == "get") {
var u = d(p.formData).param();
r += u;
}
xhr.open(p.method, p.uploadScript, true);
xhr.setRequestHeader(
"Content-Type",
"multipart/form-data; boundary=" + i
);
if (typeof p.onUploadFile === "function") {
p.onUploadFile.call(s, a);
}
xhr.sendAsBinary(o);
};
t.readAsBinaryString(a);
}
}
};
f.progress = function (e, i) {
if (d.inArray("onProgress", p.overrideEvents) < 0) {
if (e.lengthComputable) {
var t = Math.round((e.loaded / e.total) * 100);
}
i.queueItem.find(".fileinfo").html(" - " + t + "%");
i.queueItem.find(".progress-bar").css("width", t + "%");
}
if (typeof p.onProgress === "function") {
p.onProgress.call(s, i, e);
}
};
f.error = function (e, i, t) {
if (d.inArray("onError", p.overrideEvents) < 0) {
switch (e) {
case "404_FILE_NOT_FOUND":
errorMsg = "404 Error";
break;
case "403_FORBIDDEN":
errorMsg = "403 Forbidden";
break;
case "FORBIDDEN_FILE_TYPE":
errorMsg = "Forbidden File Type";
break;
case "FILE_SIZE_LIMIT_EXCEEDED":
errorMsg = "File Too Large";
break;
default:
errorMsg = "Unknown Error";
break;
}
i.queueItem
.addClass("error")
.find(".fileinfo")
.html(" - " + errorMsg);
i.queueItem.find(".progress").remove();
}
if (typeof p.onError === "function") {
p.onError.call(s, e, i);
}
i.skip = true;
if (e == "404_FILE_NOT_FOUND") {
f.uploads.errors++;
} else {
f.queue.errors++;
}
if (t) {
r.upload.call(s, null, true);
}
};
f.uploadComplete = function (e, i, t) {
if (d.inArray("onUploadComplete", p.overrideEvents) < 0) {
i.queueItem.find(".progress-bar").css("width", "100%");
i.queueItem.find(".fileinfo").html(" - 上传成功");
i.queueItem.find(".progress").slideUp(250);
i.queueItem.addClass("complete");
}
if (typeof p.onUploadComplete === "function") {
p.onUploadComplete.call(s, i, i.xhr.responseText);
}
if (p.removeCompleted) {
setTimeout(function () {
r.cancel.call(s, i);
}, 3e3);
}
i.complete = true;
f.uploads.successful++;
f.uploads.count++;
f.uploads.current--;
delete i.xhr;
if (t) {
r.upload.call(s, null, true);
}
};
f.queueComplete = function () {
if (typeof p.onQueueComplete === "function") {
p.onQueueComplete.call(s, f.uploads);
}
};
if (
window.File &&
window.FileList &&
window.Blob &&
(window.FileReader || window.FormData)
) {
p.id = "uploadifive-" + s.attr("id");
f.button = d(
'<div id="' +
p.id +
'" class="uploadifive-button">' +
p.buttonText +
"</div>"
);
if (p.buttonClass) f.button.addClass(p.buttonClass);
f.button.css({
height: p.height,
"line-height": p.height + "px",
overflow: "hidden",
position: "relative",
"text-align": "center",
width: p.width,
});
s.before(f.button).appendTo(f.button).hide();
f.createInput.call(s);
if (!p.queueID) {
p.queueID = p.id + "-queue";
f.queueEl = d(
'<div id="' + p.queueID + '" class="uploadifive-queue" />'
);
f.button.after(f.queueEl);
} else {
f.queueEl = d("#" + p.queueID);
}
if (p.dnd) {
var t = p.dropTarget ? d(p.dropTarget) : f.queueEl.get(0);
t.addEventListener(
"dragleave",
function (e) {
e.preventDefault();
e.stopPropagation();
},
false
);
t.addEventListener(
"dragenter",
function (e) {
e.preventDefault();
e.stopPropagation();
},
false
);
t.addEventListener(
"dragover",
function (e) {
e.preventDefault();
e.stopPropagation();
},
false
);
t.addEventListener("drop", f.drop, false);
}
if (!XMLHttpRequest.prototype.sendAsBinary) {
XMLHttpRequest.prototype.sendAsBinary = function (e) {
function i(e) {
return e.charCodeAt(0) & 255;
}
var t = Array.prototype.map.call(e, i);
var n = new Uint8Array(t);
this.send(n.buffer);
};
}
if (typeof p.onInit === "function") {
p.onInit.call(s);
}
} else {
if (typeof p.onFallback === "function") {
p.onFallback.call(s);
}
return false;
}
});
},
debug: function () {
return this.each(function () {
console.log(d(this).data("uploadifive"));
});
},
clearQueue: function () {
this.each(function () {
var e = d(this),
t = e.data("uploadifive"),
n = t.settings;
for (var o in t.inputs) {
input = t.inputs[o];
limit = input.files.length;
for (i = 0; i < limit; i++) {
file = input.files[i];
r.cancel.call(e, file);
}
}
if (typeof n.onClearQueue === "function") {
n.onClearQueue.call(e, d("#" + t.settings.queueID));
}
});
},
cancel: function (n, o) {
this.each(function () {
var e = d(this),
i = e.data("uploadifive"),
t = i.settings;
if (typeof n === "string") {
if (!isNaN(n)) {
fileID = "uploadifive-" + d(this).attr("id") + "-file-" + n;
}
n = d("#" + fileID).data("file");
}
n.skip = true;
i.filesCancelled++;
if (n.uploading) {
i.uploads.current--;
n.uploading = false;
n.xhr.abort();
delete n.xhr;
r.upload.call(e);
}
if (d.inArray("onCancel", t.overrideEvents) < 0) {
i.removeQueueItem(n, o);
}
if (typeof t.onCancel === "function") {
t.onCancel.call(e, n);
}
});
},
upload: function (o, r) {
this.each(function () {
var e = d(this),
i = e.data("uploadifive"),
t = i.settings;
if (o) {
i.uploadFile.call(e, o);
} else {
if (
i.uploads.count + i.uploads.current < t.uploadLimit ||
t.uploadLimit == 0
) {
if (!r) {
i.uploads.attempted = 0;
i.uploads.successsful = 0;
i.uploads.errors = 0;
var n = i.filesToUpload();
if (typeof t.onUpload === "function") {
t.onUpload.call(e, n);
}
}
d("#" + t.queueID)
.find(".uploadifive-queue-item")
.not(".error, .complete")
.each(function () {
_file = d(this).data("file");
if (
(i.uploads.current >= t.simUploadLimit &&
t.simUploadLimit !== 0) ||
(i.uploads.current >= t.uploadLimit && t.uploadLimit !== 0) ||
(i.uploads.count >= t.uploadLimit && t.uploadLimit !== 0)
) {
return false;
}
if (t.checkScript) {
_file.checking = true;
skipFile = i.checkExists(_file);
_file.checking = false;
if (!skipFile) {
i.uploadFile(_file, true);
}
} else {
i.uploadFile(_file, true);
}
});
if (
d("#" + t.queueID)
.find(".uploadifive-queue-item")
.not(".error, .complete")
.size() == 0
) {
i.queueComplete();
}
} else {
if (i.uploads.current == 0) {
if (d.inArray("onError", t.overrideEvents) < 0) {
if (i.filesToUpload() > 0 && t.uploadLimit != 0) {
alert("The maximum upload limit has been reached.");
}
}
if (typeof t.onError === "function") {
t.onError.call(e, "UPLOAD_LIMIT_EXCEEDED", i.filesToUpload());
}
}
}
}
});
},
destroy: function () {
this.each(function () {
var e = d(this),
i = e.data("uploadifive"),
t = i.settings;
r.clearQueue.call(e);
if (!t.queueID) d("#" + t.queueID).remove();
e.siblings("input").remove();
e.show().insertBefore(i.button);
i.button.remove();
if (typeof t.onDestroy === "function") {
t.onDestroy.call(e);
}
});
},
};
d.fn.uploadifive = function (e) {
if (r[e]) {
return r[e].apply(this, Array.prototype.slice.call(arguments, 1));
} else if (typeof e === "object" || !e) {
return r.init.apply(this, arguments);
} else {
d.error("The method " + e + " does not exist in $.uploadify");
}
};
})(jQuery);