JqXHR , ajax blob-header entfernen bei Benutzung von blueimp jquery.fileupload.js und mini-ajax-file-upload-form
Hallo zusammen,
Ich benutze folgende Scripts für mein File-Upload-GUI:
http://tutorialzine.com/2013/05/mini-ajax-file-upload-form/
https://github.com/blueimp/jQuery-File-Upload
Mein Problem liegt darin, dass beim Senden eines chunks oberhalb der binären Daten auch noch ein Header mitgesendet wird, der folgendermasse aussieht:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - 25861752531267
Content-Disposition: form-data; name="upl"; filename="1.rar"
Content-Type: application/octet-stream
Diesen Header möchte ich gerne entfernen.
Dazu habe ich schon ne Menge Ansätze im Netz gefunden, die aber alle nichts geholfen haben.
Hat hierzu bitte jemand eine Idee? Ich sitze schon ein paar Tage an dem Problem und komme einfach nicht weiter.
Dazu habe nun folgende options (Ausschnitt):
$('#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;
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('' + formatFileSize( file.size ) + '');
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.type;
data.contentType = data.files.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;
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' );
}
});
Vielen Dank im Voraus !!!
Ich benutze folgende Scripts für mein File-Upload-GUI:
http://tutorialzine.com/2013/05/mini-ajax-file-upload-form/
https://github.com/blueimp/jQuery-File-Upload
Mein Problem liegt darin, dass beim Senden eines chunks oberhalb der binären Daten auch noch ein Header mitgesendet wird, der folgendermasse aussieht:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - 25861752531267
Content-Disposition: form-data; name="upl"; filename="1.rar"
Content-Type: application/octet-stream
Diesen Header möchte ich gerne entfernen.
Dazu habe ich schon ne Menge Ansätze im Netz gefunden, die aber alle nichts geholfen haben.
Hat hierzu bitte jemand eine Idee? Ich sitze schon ein paar Tage an dem Problem und komme einfach nicht weiter.
Dazu habe nun folgende options (Ausschnitt):
$('#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;
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('' + formatFileSize( file.size ) + '');
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.type;
data.contentType = data.files.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;
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' );
}
});
Vielen Dank im Voraus !!!
Bitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 288814
Url: https://administrator.de/contentid/288814
Ausgedruckt am: 23.11.2024 um 15:11 Uhr
4 Kommentare
Neuester Kommentar
Dieser "Header" ist das multipart/form-data Encoding.
Und da es bei
Die Methode ohne zusätzliches Encoding heißt
Allerdings kann die auch keine weiteren Formular-Daten übertragen (wie den Dateinamen).
Allerdings hast du dich wahrscheinlich sowieso schon verlaufen, wenn du an so einem Problemen hängst, denn bis auf CGI-Skripts in CSH oder Server-Side Handler in C hat jede im Web verwendete Programmiersprache die Möglichkeit die POST-Daten automatisch zu zerlegen und dir den extrahierten Datenstrom zu liefern...
Und da es bei
POST
nur multipart/form-data und application/x-www-form-urlencoded gibt (wenn der Client ein Browser ist), wobei letzteres nicht für Datei-Uploads zu empfehlen ist, wird das mit deinem Vorhaben nichts.Die Methode ohne zusätzliches Encoding heißt
PUT
.Allerdings kann die auch keine weiteren Formular-Daten übertragen (wie den Dateinamen).
Allerdings hast du dich wahrscheinlich sowieso schon verlaufen, wenn du an so einem Problemen hängst, denn bis auf CGI-Skripts in CSH oder Server-Side Handler in C hat jede im Web verwendete Programmiersprache die Möglichkeit die POST-Daten automatisch zu zerlegen und dir den extrahierten Datenstrom zu liefern...