我正在尝试从Apex File浏览器上传图像文件,因为图像文件很大,因此我正在使用Chunked上传技术将图像上传到数据库。一切工作正常,因为Apex Collections中使用了分块文件来传递ajax回调过程以在数据库中进行更新。这是我在javascript中以分块上传图片的代码
var fileInputElem = document.getElementById('P130_FILE_UPLOAD');
var fileIndex = 0;
// builds a js array from long string
function clob2Array(clob, size, array) {
loopCount = Math.floor(clob.length / size) + 1;
for (var i = 0; i < loopCount; i++) {
array.push(clob.slice(size * i, size * (i + 1)));
}
return array;
}
// converts binaryArray to base64 string
function binaryArray2base64(int8Array) {
var data = "";
var bytes = new Uint8Array(int8Array);
var length = bytes.byteLength;
for (var i = 0; i < length; i++) {
data += String.fromCharCode(bytes[i]);
}
return btoa(data);
}
// a recursive function that calls itself to upload multiple files synchronously
function uploadFile(pFileIndex) {
var file = fileInputElem.files[pFileIndex];
var reader = new FileReader();
reader.onload = (function(pFile) {
return function(e) {
if (pFile) {
var base64 = binaryArray2base64(e.target.result);
var f01Array = [];
f01Array = clob2Array(base64, 30000, f01Array);
apex.server.process(
'UPLOAD_FILE',
{
x01: file.name,
x02: file.type,
f01: f01Array
},
{
dataType: 'json',
success: function(data) {
if (data.result == 'success') {
fileIndex++;
if (fileIndex < fileInputElem.files.length) {
// start uploading the next file
uploadFile(fileIndex);
} else {
// all files have been uploaded at this point
spinner.stop();
fileInputElem.value = '';
$('#uploadedFilesRpt').trigger('apexrefresh');
}
} else {
alert('Oops! Something went terribly wrong. Please try again or contact your application administrator.');
}
}
}
);
}
}
})(file);
reader.readAsArrayBuffer(file);
}
// variables for spin.js
var spinner;
var spinTargetElem = document.getElementById('wwvFlowForm');
var spinOptions = {
lines: 13
, length: 28
, width: 14
, radius: 42
, scale: 1
, corners: 1
, color: '#000'
, opacity: 0.25
, rotate: 0
, direction: 1
, speed: 1
, trail: 60
, fps: 20
, zIndex: 2e9
, className: 'spinner'
, top: '50%'
, left: '50%'
, shadow: false
, hwaccel: false
, position: 'absolute'
}
Ajax回调到服务器级别的进程
declare
lco_collection_name constant apex_collections.collection_name%type := 'UPLOADED_FILES';
l_blob blob;
l_filename varchar2(200);
l_mime_type varchar2(200);
l_token varchar2(32000);
begin
l_filename := apex_application.g_x01;
l_mime_type := nvl(apex_application.g_x02, 'application/octet-stream');
-- build BLOB from f01 30k array (base64 encoded)
dbms_lob.createtemporary(l_blob, false, dbms_lob.session);
for i in 1 .. apex_application.g_f01.count loop
l_token := wwv_flow.g_f01(i);
if length(l_token) > 0 then
dbms_lob.append(
dest_lob => l_blob,
src_lob => to_blob(utl_encode.base64_decode(utl_raw.cast_to_raw(l_token)))
);
end if;
end loop;
-- add collection member (only if BLOB is not null)
if dbms_lob.getlength(l_blob) is not null then
apex_collection.add_member(
p_collection_name => lco_collection_name,
p_c001 => l_filename,
p_c002 => l_mime_type,
p_blob001 => l_blob
);
end if;
apex_json.open_object;
apex_json.write(
p_name => 'result',
p_value => 'success'
);
apex_json.close_object;
exception
when others then
apex_json.open_object;
apex_json.write(
p_name => 'result',
p_value => 'fail'
);
apex_json.close_object;
end;
我唯一想要调整上传图像大小的东西,例如,如果大小大于800x600,则应在客户端而不是服务器端将其大小调整为800x600。请提出一些最佳方法,以便我可以在JavaScript代码中调整图片大小。