Filename is set to "blob" on request payload

[Sarit]

Hi,

 

I'm using RadAsyncUpload to upload multiple files.

when uploading i can see in fiddler extra data on the headers of the AJAX upload.

The file are uploaded correctly buy he problem is that I have a firewall that needs to get the correct filename that is uploaded and not a generic "blob"

Content-Disposition: form-data; name="%%File.48257279001171c9.2c36671da7f1b6c9482575de002e1f14.$Body.0.3D8"; filename="blob"
Content-Type: image/png
------WebKitFormBoundaryW0NQVOkdrfkYGWV3--

additional data:

1. using the older radupload (which does not support multiple files to be uploaded) sets the right name

2. we inspected the telerik dll and noticed that there are specific code lines that set the filename to blob.

Can you please advise on solution to the name setting ?

Thank you

 

[Hamza]

Hello there,

We encounter exactly this issue.

Did you find any solution to your problem ?

Thank you for your help,

Olivier.

[Marin Bratanov]

Hello Olivier, Sarit,

I have just answered Oliver's support ticket with this question and I am pasting my answer here as a reference to confirm that RadAsyncUpload does not explicitly set this string, it is the browser API default value.

The "blob" string comes from the browser implementation of file chunking - this is how the object that holds a piece of a file created through the browser FileAPI is called and how it appears when stringified. Simply put, the default file name that is used for blob objects is "blob": https://developer.mozilla.org/en-US/docs/Web/API/FormData/append. You can see the same behavior with a simple input of type=file with the following code:

<script>
    function testMe(theInput) {
        console.log(theInput.files[0].slice(0, 500));
    }
</script>
<input type="file" onchange="testMe(this);" />

 

and when changing the RadAsyncUpload code to log the chunk that gets sent to the handler:

if ($telerik.isOpera) {
    console.log("adding the blob name for Opera which will not be called unless under Opera");
    this.formData.append("file", currentChunk, "blob");
}
else {
    console.log(currentChunk);
    this.formData.append("file", currentChunk);
}

 

 

You can find attached a video that illustrates this in action as a reference.

Now, to get to the actual question of getting the file name from the request - I can suggest the following options:

• If you disable chunk uploads, every file will be uploaded at one piece and this means that the request will always contain the field called "fileName" with the value of the file. To disable chunk uploads, set DisableChunkUpload="true".
• You can use a standard <input type="file" /> if its request fits your needs better.
• You can also override the RadAsyncUpload method that adds chunks to the XHR request, but I must note that we do not test or support this, and I cannot guarantee it will not cause issues. There are two ways to do that:
  • Download our source code from your account, go to AsyncUpload\Modules\FileAPI\FileAPI.js and find the writeFormData method so you can change the line I showed above where the formData.append() method is used.
  • Add the function override that is attached below to your page, after the script manager, preferably at the end of the form.

I must also note that the following name for the post data parameter is not expected and is not likely to come from our controls : name="%%File.48257279001171c9.2c36671da7f1b6c9482575de002e1f14.$Body.0.3D8"; and it is possible that a browser extension, firewall or other third party software interferes with the request. The name of the field RadAsyncUpload uses is "file". Thus, you may want to look into other offending code as well. Using Incognito mode in the browser is likely to prevent extensions from running and thus eliminate or confirm at least one of the suspects.

Regards,
Marin Bratanov
Progress Telerik