如何使用blueimp jquery上传插件获取每个块的md5迭代的md5总和 [英] How to get md5 iterated md5 sum of every chunk, using blueimp jquery upload plugin
本文介绍了如何使用blueimp jquery上传插件获取每个块的md5迭代的md5总和的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我需要计算并发送迭代的md5-hash到我的上载API. 但是我不知道怎么办.
我正在使用此处的教程:
附带 blueimp jQuery上传插件.
仅发送一个文件(文件大小小于块大小)，一切正常.但是，如果文件被分块，那么我不知道如何捕获该块以获取文件的md5.
最后，我必须像下面描述的那样反复制作md5:
$('#upload').fileupload({
// This element will accept file drag/drop uploading
dropZone: $('#drop'),
type : GLOBAL_FORM_METHOD,
method : "post", // Type of data-send-method
dataType : "json", // Type of data to recieve from api-call
maxChunkSize: GLOBAL_CHUNK_SIZE,
multipart : true,
// This function is called when a file is added to the queue;
// either via the browse button, or via drag/drop:
add: function (e, data)
{
var reader = new FileReader();
var file = data.files[0];
var jqXHR;
var tpl = $('<li class="working"><input type="text" value="0" data-width="48" data-height="48"'+
' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" /><p></p><div class="msg"></div><span></span></li>');
// Append the file name and file size
tpl.find('p')
.text( file.name )
.append('<i>' + formatFileSize( file.size ) + '</i>');
// Add the HTML to the UL element
data.context = tpl.appendTo(ul);
// Initialize the knob plugin
tpl.find('input').knob();
// Listen for clicks on the cancel icon
tpl.find('span').click(function()
{
if( tpl.hasClass('working') )
{
jqXHR.abort();
}
tpl.fadeOut( function()
{
tpl.remove();
});
});
// Prevent XHR from sending data in "multipart/formData"
data.postMessage = data.files[0].type;
data.contentType = data.files[0].type;
var chunksize = GLOBAL_CHUNK_SIZE > file.size ? file.size : GLOBAL_CHUNK_SIZE;
// Describe the FileReader-DataLoad-Event
reader.onload = function( event )
{
var binary = event.target.result;
var md5 = CryptoJS.MD5(binary).toString();
data.url += "&md5sum=" + md5;
// D A T A S E N D
jqXHR = data.submit();
};
// ADD url to XHR-object
data.url = GLOBAL_FORM_ACTION;
data.url += "?etf_id=" + GLOBAL_FOLDER_ID;
data.url += "&file_title=" + file.name;
// If the file will be send in one piece...
if( GLOBAL_CHUNK_SIZE > file.size )
{
// ADD url-parameter to XHR-object
data.url += "&size_chunk_start=" + 0;
data.url += "&size_chunk_length=" + chunksize;
}
// This part for the chunks must be in "beforeSend"-Callback,
// because, the chunk-related size-data is undefined in this case
// but available there.
// ADD url-parameter to XHR-object
data.url += "&size_final=" + file.size;
// Read md5-sum and send the file / chunk...
// On multipart "file" is a chunk !
reader.readAsBinaryString( file );
},
beforeSend : function(e, data)
{
var file = data.files[0];
this.find(".msg").hide();
// If the file will be send as chunks...
if( GLOBAL_CHUNK_SIZE < file.size )
{
console.log( "Chunk data: ", data.uploadedBytes, data.chunkSize, file.size, data );
// ADD url-parameter to XHR-object
data.url += "&size_chunk_start=" + data.uploadedBytes;
data.url += "&size_chunk_length=" + data.chunkSize;
if( typeof this.attr('session_id') !== "undefined" )
data.url += "&session_id=" + this.attr( 'session_id' );
}
});
希望您能帮到我，以便我自己解决这个问题.
解决方案
这个类似问题的答案提供了实现此目的的方法.还有一些库可以为您做到这一点，例如CryptoJS
要点是，您用0字节填充文件以达到一定的长度，该长度可以被块长度整除，然后将数据逐块读取到缓冲区中并具有该数据.然后，您为读取的每个块附加该哈希.I need to calculate and send an iterated md5-hash to my upload-api. But I don't know how.
I´m using the tutorial found here:
Along with the blueimp jquery upload plugin.
For sending only ONE FILE (file size smaller than chunk size), everything is working fine. But if a file is chunked, then I have no idea, how to catch the chunk to get md5 of it.
At the end I have to make the md5 iteratively like described here:
$('#upload').fileupload({
// This element will accept file drag/drop uploading
dropZone: $('#drop'),
type : GLOBAL_FORM_METHOD,
method : "post", // Type of data-send-method
dataType : "json", // Type of data to recieve from api-call
maxChunkSize: GLOBAL_CHUNK_SIZE,
multipart : true,
// This function is called when a file is added to the queue;
// either via the browse button, or via drag/drop:
add: function (e, data)
{
var reader = new FileReader();
var file = data.files[0];
var jqXHR;
var tpl = $('<li class="working"><input type="text" value="0" data-width="48" data-height="48"'+
' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" /><p></p><div class="msg"></div><span></span></li>');
// Append the file name and file size
tpl.find('p')
.text( file.name )
.append('<i>' + formatFileSize( file.size ) + '</i>');
// Add the HTML to the UL element
data.context = tpl.appendTo(ul);
// Initialize the knob plugin
tpl.find('input').knob();
// Listen for clicks on the cancel icon
tpl.find('span').click(function()
{
if( tpl.hasClass('working') )
{
jqXHR.abort();
}
tpl.fadeOut( function()
{
tpl.remove();
});
});
// Prevent XHR from sending data in "multipart/formData"
data.postMessage = data.files[0].type;
data.contentType = data.files[0].type;
var chunksize = GLOBAL_CHUNK_SIZE > file.size ? file.size : GLOBAL_CHUNK_SIZE;
// Describe the FileReader-DataLoad-Event
reader.onload = function( event )
{
var binary = event.target.result;
var md5 = CryptoJS.MD5(binary).toString();
data.url += "&md5sum=" + md5;
// D A T A S E N D
jqXHR = data.submit();
};
// ADD url to XHR-object
data.url = GLOBAL_FORM_ACTION;
data.url += "?etf_id=" + GLOBAL_FOLDER_ID;
data.url += "&file_title=" + file.name;
// If the file will be send in one piece...
if( GLOBAL_CHUNK_SIZE > file.size )
{
// ADD url-parameter to XHR-object
data.url += "&size_chunk_start=" + 0;
data.url += "&size_chunk_length=" + chunksize;
}
// This part for the chunks must be in "beforeSend"-Callback,
// because, the chunk-related size-data is undefined in this case
// but available there.
// ADD url-parameter to XHR-object
data.url += "&size_final=" + file.size;
// Read md5-sum and send the file / chunk...
// On multipart "file" is a chunk !
reader.readAsBinaryString( file );
},
beforeSend : function(e, data)
{
var file = data.files[0];
this.find(".msg").hide();
// If the file will be send as chunks...
if( GLOBAL_CHUNK_SIZE < file.size )
{
console.log( "Chunk data: ", data.uploadedBytes, data.chunkSize, file.size, data );
// ADD url-parameter to XHR-object
data.url += "&size_chunk_start=" + data.uploadedBytes;
data.url += "&size_chunk_length=" + data.chunkSize;
if( typeof this.attr('session_id') !== "undefined" )
data.url += "&session_id=" + this.attr( 'session_id' );
}
});
I hope you help, so that I can myself solve this.
解决方案
This answer to a similar question offers a method to accomplish this. There are also libraries that will do this for you, like CryptoJS
the gist is you pad your file with 0 bytes to reach a certain length that is divisible by a chunk length, then you read the data into a buffer chunk by chunk, and has that data. Then you append that hash for each chunk you read.
MD5 Hash a large file incrementally
这篇关于如何使用blueimp jquery上传插件获取每个块的md5迭代的md5总和的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
