Hi,
i am trying to upload large Files up to 100GB with the Filemanager in our Blazor-Server-Side app.
Here is my razor code:
SfFileManager TValue="FileManagerDirectoryContent" AllowDragAndDrop="true" AllowMultiSelection="true">
<FileManagerUploadSettings MaxFileSize=20000000000 AutoClose="true"> @
</FileManagerUploadSettings>
<FileManagerAjaxSettings
Url="https://localhost:3000/api/app/filemanager/fileoperations"
GetImageUrl="https://localhost:3000/api/app/filemanager/getimage"
UploadUrl="https://localhost:3000/api/app/filemanager/upload"
DownloadUrl="https://localhost:3000/api/app/filemanager/download">
</FileManagerAjaxSettings>
</SfFileManager>
<SfUploader ID="UploadFiles" MaxFileSize=100000000000>
<UploaderAsyncSettings SaveUrl="https://localhost:3000/api/app/filemanager/save" RemoveUrl="https://localhost:3000/api/app/filemanager/remove" ChunkSize=500000 RetryCount=5 RetryAfterDelay =3000>
</UploaderAsyncSettings>
</SfUploader>
(till 30mb) without problems with the filemanager.with bigger files i get an error :Butif i upload the same file at same site with the Uploader below the filemanager it works perfectly.
i have tryd overriding the UploadUrlfrom filemanager but this didn't work as expected.
Maybe there is a way i can directly access the file upload controller you use within filemanager to set these settings?
My app uses exactly your code from your site:
https://blazor.syncfusion.com/documentation/file-manager/getting-started
https://blazor.syncfusion.com/documentation/file-upload/chunk-upload
Here the controllerparts:
public IActionResult Upload(string path, IListuploadFiles, string action)
{
//Invoking upload operation with the required paramaters
// path - Current path where the file is to uploaded; uploadFiles - Files to be uploaded; action - name of the operation(upload)
FileManagerResponse uploadResponse;
uploadResponse = operation.Upload(path, uploadFiles, action, null);
if (uploadResponse.Error != null)
{
Response.Clear();
Response.ContentType = "application/json; charset=utf-8";
Response.StatusCode = Convert.ToInt32(uploadResponse.Error.Code);
Response.HttpContext.Features.Get().ReasonPhrase = uploadResponse.Error.Message;
}
return Content("");
}
public void Save(IListchunkFile, IList UploadFiles)
{
long size = 0;
try
{
// for chunk-upload
foreach (var file in chunkFile)
{
var filename = ContentDispositionHeaderValue
.Parse(file.ContentDisposition)
.FileName
.Trim('"');
filename = fullPath + $@"\{filename}";
size += file.Length;
if (!System.IO.File.Exists(filename))
{
using (FileStream fs = System.IO.File.Create(filename))
{
file.CopyTo(fs);
fs.Flush();
}
}
else
{
using (FileStream fs = System.IO.File.Open(filename, FileMode.Append))
{
file.CopyTo(fs);
fs.Flush();
}
}
}
}
catch (Exception e)
{
Response.Clear();
Response.StatusCode = 204;
Response.HttpContext.Features.Get().ReasonPhrase = "File failed to upload";
Response.HttpContext.Features.Get().ReasonPhrase = e.Message;
}
}
Mmmh, i did some testing.. It seems that the chunk upload sometimes is broken, and the saved file is corrupt..I did test with 500mb file multiple times..
I run my tests with visual studio and iisexpress and see during debugging and error in the Save Function which is used for chunk upload. i ll get :
"The process cannot access the file .... because it is being used by another process."
But that error doesn't seem to interrupt the upload ? i dont receive an error message in the upload ui..?
Any Ideas also on that ?
|
<SfUploader ID="UploadFiles" AutoUpload="false" MaxFileSize=100000000000>
<UploaderAsyncSettings SaveUrl="/api/FileManager/Save" ChunkSize=500000>
</UploaderAsyncSettings>
<UploaderEvents Success="OnSuccess" FileSelected="OnFileSelect"></UploaderEvents>
</SfUploader>
<SfFileManager TValue="FileManagerDirectoryContent" @ref="filemanager" AllowDragAndDrop="true" AllowMultiSelection="true">
...
<FileManagerEvents TValue="FileManagerDirectoryContent" ToolbarItemClicked="ToolbarClicked"></FileManagerEvents>
</SfFileManager>
@code{
SfFileManager<FileManagerDirectoryContent> filemanager;
public void ToolbarClicked(ToolbarClickEventArgs<FileManagerDirectoryContent> args)
{
if (args.Item.Text == "Upload")
{
//Cancel the File Manager upload
args.Cancel = true;
//Trigger upload operation of Uploader
JS.InvokeAsync<string>("callUpload");
}
}
public void OnSuccess(SuccessEventArgs args)
{
//Refresh the uploaded files
filemanager.RefreshFilesAsync();
}
public void OnFileSelect(SelectedEventArgs args)
{
var p = filemanager.Path;
// add additional data as key-value pair.
args.CustomFormData = new List<object> { new { Path = p } };
}
}
<style>
.e-file-select-wrap {
display: none;
}
</style> |
|
<script>
window.callUpload = () => {
document.getElementById("UploadFiles").click();
};
</script> |
|
// Upload save method for chunk-upload
[Route("Save")]
public void Save(IList<IFormFile> chunkFile, IList<IFormFile> UploadFiles, IFormCollection form)
{
var data = Request.Form["path"];
var path = data.ToString().Replace("/", "\\");
long size = 0;
try
{
// for chunk-upload
foreach (var file in chunkFile)
{
var filename = ContentDispositionHeaderValue
.Parse(file.ContentDisposition)
.FileName
.Trim('"');
filename = this.basePath + "\\" + this.root + path + "\\" + $@"{filename}";
size += file.Length;
if (!System.IO.File.Exists(filename))
{
using (FileStream fs = System.IO.File.Create(filename))
{
file.CopyTo(fs);
fs.Flush();
}
}
else
{
………
………
}} |
Hi
Indhumathy,
i thank you for your comprehensive answer. Wow ! A really fast, good and detailed response.
And the best is you did include a working sample that looks like what i wanted to achieve.
I did try that sample and it works like a charm !
I hope you will integrate in future the chunk upload in Filemanager directly,
so it uses chunk upload automatically if necessary for big files.
I will check your links you provide for the second error.
Could also be an issue with visual Studio 2022.
I hope your Support says as that sharp as it just is.
We did evaluate syncfusion for us, and now gonna purchase it.
Thank you.
Hi Syncfusion Support,
i did face the second issue "
The process cannot access the file .... because it is being used by another process" a few times.
We use two Components here in that example the Filemanager and a SfUploader.
After choosing files with the filemanager we cancel the upload through filemanager and start an upload with the sfuploader Componenent. But although we cancel the upload from filemanager it seems it tries to start the upload before it reaches the cancel statement and so it blocks the process..
If i use only the sfupload this error doesn't seem to occur. But i will test further.
I am not sure why this happens. The code should avoid that. Maybe its an timming issue because of an async upload call from the filemanager. Can you please take a look at this again.. ?